fortherest fortherest - 4 months ago 7
HTML Question

Dynamic numeric form control issue

I add form using jquery append method and this method has

.numerik_kontrol
class but this functions working are another form but it's not working on my dynamic form

my function;

$(document).ready(function(){

/** numerik kontrol*/
$(".numerik_kontrol").keydown(function (e) {
// Allow: backspace, delete, tab, escape, enter and .
if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 ||
// Allow: Ctrl+A, Command+A
(e.keyCode === 65 && (e.ctrlKey === true || e.metaKey === true)) ||
// Allow: home, end, left, right, down, up
(e.keyCode >= 35 && e.keyCode <= 40)) {
// let it happen, don't do anything
return;
}
// Ensure that it is a number and stop the keypress
if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
e.preventDefault();
}
});
/** numerik kontrol bitiş*/

/** select seçim*/
$(".btn_ekle").on("click", function(e) {
var ekle = $(".ekle").html();
$(".add_after").append(ekle).show();

e.preventDefault();

});



$(document).on('change', '.havale_tipi', function() {
var value = $(this).val(),
parent = $(this).closest(".group");
if (value == "iban_no") {
$(".hesaba_form", parent).fadeOut();
$(".iban_no_form", parent).fadeIn();
} else {
$(".iban_no_form", parent).fadeOut();
$(".hesaba_form", parent).fadeIn();
}


});



$(document).on("click", ".iade_sil", function() {

var form_sil;
var form_sil = confirm("Formu silmek istediğinize emin misiniz ?");
if (form_sil == true) {
$(this).closest(".group").remove();
} else {
return false;
}
});

document.getElementById('iade_miktari').className="numerik_kontrol";


});


if you wanna check out full click this link - demo page

if you click bottom of the form button(left button) you gonna see dynamic forms

Answer

In your $(document).ready use a $(document).on event handler instead of a keydown handler on existing numerik_kontrol elements. This will bind the handler to the document and evaluate the selector when every keydown event occurs, instead of directly binding the handler to the result of the single selector evaluation in $(document).ready

i.e.

instead of:

$(".numerik_kontrol"),keydown(function(e) { ...

try something more like this:

$document.on("keydown", ".numerik_kontrol", function(e) { ...
Comments