He agregado este enlace para agregar una nueva fila a mi formulario:
<a id="add" class="btn btn-info" style="color:white">New row</a>Y aquí está el código jQuery:
$(document).ready(function(){ var i = 1; if(i == 1){ $('#add').click(function(){ i++; $('#dynamic_field').append("HERE GOES THE ROW ELEMENTS"); }); } });Y funciona bien.
Pero necesito determinar que agregue una nueva fila solo una vez y no varias veces.
Así que intenté verificar if(i == 1){ en jQuery, pero parece que no funciona y el usuario aún puede agregar una nueva fila varias veces.
Entonces, ¿cómo puedo limitar esto a una sola vez?
La respuesta de Kiran, que es el mejor enfoque en mi opinión, pero traté de extender su código con n veces.
const unbindEventWithParam = (n, fn) => { let i = 0 function addRow(event){ console.log('event is running') i++ fn() if(i == n) return $(this).off(event.type) } return addRow } const addRow = unbindEventWithParam(2, function(){ $('#dynamic_field').append("add row 1 ") }) const addRow1 = unbindEventWithParam(4, function(){ $('#dynamic_field1').append("add row 2 ") }) $('#add').click(addRow) $('#add1').click(addRow1) <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <a id="add" class="btn btn-info">New row</a> <div id="dynamic_field"></div> <a id="add1" class="btn btn-info">New row1</a> <div id="dynamic_field1"></div> <button id="new-event">New event</button>