0

I am unable to trigger the change of the text in the current scenario.

If i click on the button i am changing the content of the text. So how can i trigger the change of the text which is caused by external event. For example in a click of a button I can able to fill any text in the textbox, able to paste texts and using mouse and keyboard. In these all scenarios and scenarios like these also I want the event to be fired.

I have already tried the following.

$('#text_id').on('change', function () {
    alert('This is not trigged when i changed the text');
});

The alert should come when the text is changed. There might be many possible sources to change the text.

This is the Fiddle i created.

Thanks in advance.

This is my updated fiddle

Karthik AMR
  • 1,694
  • 21
  • 29
user3354774
  • 11
  • 3

4 Answers4

1

Updated Fiddle - http://jsfiddle.net/upa2A/1/

$(document).ready(function () {
    $(document).on('click', "#button_id", function () {
        $('#text_id').val('TExt changed')
    });

    $(document).on('change', "#text_id", function () {
        alert('This is not trigged when i changed the text');
    });
});

Issues in original Fiddle -

  • Code has to be inside $(document).ready()
  • Missing () after function
  • Incorrect use of $.on (Read more about it on http://api.jquery.com/on/)

Edit based on comment from asked -

Updated Fiddle - http://jsfiddle.net/upa2A/4/

$(document).ready(function () {
    $(document).on('click', "#button_id", function () {
        $('#text_id').val('TExt changed').change();
    });

    $(document).on('change', "#text_id", function () {
        alert('This is not trigged when i changed the text');
    });
});

More edit based on comments thread -

From http://api.jquery.com/change "but for the other element types the event is deferred until the element loses focus."

Since, when changing via button click, text box wasn't focussed, the trigger does not happen automatically.

Harsh Moorjani
  • 648
  • 1
  • 5
  • 16
  • Sorry your fiddle is not triggering the change of the text. Could you please check – user3354774 Jun 23 '14 at 11:49
  • It is for me... Did you change your own fiddle or used the link I gave? Because your Fiddle didn't had JQuery library added. – Harsh Moorjani Jun 23 '14 at 11:52
  • @user3354774, that link works for me (and for Somnath). Check your browser console and let us know, if you see any errors. – Harsh Moorjani Jun 23 '14 at 11:56
  • @HarshMoorjani you are triggering manually as $('#text_id').val('TExt changed').change(). The alert come naturally when the text is changed in the text box – user3354774 Jun 23 '14 at 12:02
  • @user3354774, Type anything in the box and move out of box. It will. But when you edit if via js, you need to trigger it. – Harsh Moorjani Jun 23 '14 at 12:05
  • We wont change the text manually that would be changed in many ways i showed one example of on clicking the button. – user3354774 Jun 23 '14 at 12:08
  • @user3354774, in that case you can trigger in along with change. As you can see from - http://api.jquery.com/change/ "`but for the other element types the event is deferred until the element loses focus.`" Now, since when changing via click you never had focus, so its not triggered. – Harsh Moorjani Jun 23 '14 at 12:13
  • @HarshMoorjani Yeah i observed that one is there any way to accomplish my task – user3354774 Jun 23 '14 at 12:15
  • @user3354774 - In that case, this becomes the right answer. Please accept it :-) – Harsh Moorjani Jun 23 '14 at 12:16
  • @HarshMoorjani but that didn't meet my requirement. I should get the alert when the text is changed but you are manually triggering it ... – user3354774 Jun 23 '14 at 12:20
  • @user3354774 - Ok, but as I said - it's not possible. – Harsh Moorjani Jun 23 '14 at 12:28
0

I saw your code in jsfiddle. you missed in some brackets and semicolon . otherwise ur code write . pls check jquery library code.

$('#button_id').on('click',function()
               {
                   $('#text_id').val('TExt changed');
               }
              );

$('#text_id').on('change',function() { alert('This is not trigged when i changed the text'); } );

karthick
  • 9
  • 1
  • 2
0

Try the below code. But for this you should use jQuery. It'll raise the event whenever the text changed.

$('#text_id').on('input propertychange paste', function() {
    alert('Text Changed');
});

the working fiddle is here

Karthik AMR
  • 1,694
  • 21
  • 29
  • The alert must come when the text is changed by other event not on keyup ... like clicking on the button the text is changed that is one of the example .. – user3354774 Jun 23 '14 at 12:13
  • @user3354774 these are the basic things of text changing events described in all answers. If you want to implement a specific logic you have to use your brain to bring out that by these basic ideas. – Karthik AMR Jun 23 '14 at 12:32
  • @user3354774 I can, but it's look like you are not taking any steps at all. – Karthik AMR Jun 23 '14 at 12:36
  • @user3354774 See my updated answer and working fiddle – Karthik AMR Jun 23 '14 at 12:43
  • How about if i added some event to button and changed the text on click that is not giving the alert http://jsfiddle.net/upa2A/11/ – user3354774 Jun 23 '14 at 12:48
0

This event surely raised on text change. If it is not useful for you surely someone else will be happy for this.

var txtVal = '';
setInterval(function() {
    if ($("#text_id").val() != txtVal) {
        txtVal = $("#text_id").val();
        alert("Text Changed");
    }
}, 10);

working fiddle is here

Karthik AMR
  • 1,694
  • 21
  • 29
  • I took this code piece from http://stackoverflow.com/questions/17317465/jquery-textbox-change-event-doesnt-fire-until-textbox-loses-focus. It's a nice answer. You please refer it. – Karthik AMR Jun 23 '14 at 13:15