What to do for the javascript function n give reload on page

1

I have a javascript function that runs on the onclick of the new button and creates two HTML objects. The problem is that at the end of the function, the page is doing reload and deleting what was created. What can be done to prevent this and the created fields remain on the page? Here is the code:

var i = 1;
function novo() {

    var form, quant;

    if (parseInt(i) < 51) {
        form = "<table width='96%' border='0'><tr><td width='8%' class='tblNormal' align='Right'>Protocolo:</td>"
        form = form + "<td width='12%' class='tblNormal'><input type='hidden' name='tit" + i + "'> <input type='text' onkeypress='FiltraTecla(event);' name='ptcl" + i + "' value='' size='10' maxlength='10' onblur='javascript:pesquisa(this.name, " + i + ")'>"
        form = form + "<td width='8%' class='tblNormal' align='Right'>Nome:</td>"
        form = form + "<td width='38%' class='tblTexto'><span id='nome" + i + "'></span></td>"
        form = form + "<td width='14%' class='tblNormal' align='Right'>CNPJ/CPF:</td>"
        form = form + "<td width='21%' class='tblTexto'><span id='cpf" + i + "'></span></td>"
        form = form + "</tr></table>"

        //quantidade = i
        document.getElementById('qtd').value = i;
        document.frm.qtd.value = i;

        i = i + 1;
        formularios.innerHTML = formularios.innerHTML + form + "<br>";
    }
    else {
        alert("Numero máximo de devoluções por página.");
    }
}

ASP.NET Code:

<form name="frm" runat="server">
    <div id="page-wrapper">
        <div class="content-wrapper">
            <div class="container-fluid">
                <br />
                <br />
                <br />
                <div align="center">
                    <table border="0">
                        <tr>
                            <td align="center" colspan="5"><font color="red"><b></b></font></td>
                        </tr>
                        <tr>
                            <td class="titulo" colspan="6" align="center">
                                <h2>Cadastra Documento</h2>
                            </td>
                        </tr>
                        <tr>
                            <td class="tblNormal" width="50%" colspan="1" align="Right">Data:</td>
                            <td class="tblNormal" width="50%" colspan="1">
                                <asp:TextBox ID="txData" runat="server" maxlength="8"  onblur="formataData(this, event);"></asp:TextBox>
                              </td>
                        </tr>
                        <tr>
                            <td class="tblNormal" align="right">CPF/CNPJ do Sacado/Devedor:</td>
                            <td class="tblNormal" valign="middle">
                                <asp:TextBox ID="CPF" runat="server"  maxlength="14"  onblur="valida();"></asp:TextBox>
                                <asp:TextBox ID="Nome" runat="server" Visible="false"></asp:TextBox>
                                <asp:TextBox ID="txtQtd" runat="server" Visible="false"></asp:TextBox>
                            </td>
                        </tr>
                    </table>
                    <span id="formularios"></span>
                    <asp:HiddenField ID="qtd" runat="server" />
                    <asp:Button ID="btnNovo" runat="server" Text="Novo" OnClientClick="novo(ctl00$ContentPlaceHolder1$qtd.value);" CssClass="btn btn-default"   />
                    <asp:Button ID="btnEnviar" runat="server" Text="Enviar" OnClientClick="enviar();" CssClass="btn btn-default"   />
                </div>
            </div>
        </div>
    </div>
</form>
    
asked by anonymous 05.07.2015 / 06:08

1 answer

1

I think this button is being interpreted as a button type="submit" and therefore it makes submit form when you click it.

Two ideas to fix that I found:

UseSubmitBehaviour="false"

Join UseSubmitBehaviour="false" for the button to be seen as a button type="button" . I would stay:

<asp:Button UseSubmitBehaviour="false" ID="btnNovo" runat="server" Text="Novo" OnClientClick="novo(ctl00$ContentPlaceHolder1$qtd.value);" CssClass="btn btn-default"   />

return false;

Joins return false; (maybe also with e.preventDefault() passing the event to the function) to prevent the submit button to form . I would stay:

function novo(){
    // o teu código
    // e no final:
    return false;
}
    
05.07.2015 / 09:39