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>