7

I'm trying to alert a value using jquery when it is generated from a javascript code, the value is generated on the input box the problem is jquery cannot detect the changes, commands i tested are "change, input" but when i manually input a value jquery triggers

sample code:

value is dynamically generated on the javascript and pushed / inserted to the inputbox, the value is not manually generated javascript:

document.getElementById("displayDID").value = DisplayName ;

html:

<input type="text" id="displayDID" />

jquery:

$('#displayDID').on("input" ,function() {
            var work = $(this).val();
            alert(work);
        });

the value of the id="displayDID" changes but jquery cannot detect it after execution.

sample fiddle http://jsfiddle.net/SU7bU/1/

5
  • it works fine: jsfiddle.net/paRPL/1
    – caramba
    Feb 14, 2014 at 10:37
  • What about to change "input" to 'keyup' if you want to alert every changes, or to 'change' if you want to alert the changes after focusout
    – Pavlo
    Feb 14, 2014 at 10:37
  • it works fine on manual input, but doesnt when the value is pushed from javascript Feb 14, 2014 at 10:38
  • Try this one: $('#displayDID').val('some value').change(); - this should fire you onchange event.
    – Pavlo
    Feb 14, 2014 at 10:42
  • I think this is what you are looking for: jsfiddle.net/LGAWY/141 more information on this link, see Davids answer: stackoverflow.com/questions/1443292/…
    – caramba
    Feb 14, 2014 at 12:57

3 Answers 3

3

add trigger to it

$('#gen').on('click',function() {
    $('#field').val('val').trigger("change");
});


$(document).on("change",'#field' ,function() {
    var work = $(this).val();
    alert(work);

});

http://jsfiddle.net/ytexj/

1
  • please read the description, it is no manually triggered, it is triggered by the system. Feb 14, 2014 at 15:34
2

It is because you have added the script before input is ready.Due to which, event is not getting set on that element.write the code on document ready:

$(document).ready(function(){
 $('#displayDID').on("input" ,function() {
        var work = $(this).val();
        alert(work);
    });
})

or use event delegation:

$(document).on("input",'#displayDID' ,function() {
        var work = $(this).val();
        alert(work);
    });
2
  • still not triggering the jquery Feb 14, 2014 at 11:17
  • can you create the fiddle?? Feb 14, 2014 at 11:38
0

Ok I will propose you one answer and let's see if it solve your problem. If you use keyup, and you insert 3350 value, you will display 4 alert, and I think you want to display only 1 alert.

$(document).ready(function() {
var interval;
	$("#variazioneAnticipo").on("input", function() {
		var variazioneAnticipo = $("#variazioneAnticipo").val();
		clearInterval(interval);
    interval = setTimeout(function(){ showValue(variazioneAnticipo) }, 1000);
	});
});

function showValue(value) {
			alert("ANTICIPO VARIATO: " + value);
}
<input id="variazioneAnticipo" class="rightAlligned form-control" style="width: 60%" type="number" step="0.01" min="0" value="3" />

I explain it, when you input anything into the input, will trigger a setTimeout in 1 sec, if you press another key under this time, we clear the timeOut and we triiger again, so you will only have 1 alert 1 sec after the last input insert.

I hope it helps you, and soyy for my english :D

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.