CODEWITHSUNDEEP
jqueryasp.netonchange
Arrow
Arrow

Reputation: 2904

jQuery's .change() may not be firing

I am trying to insert a value into the Database when the value of a Textbox is changed by the User. I have checked the backend code (C#) on its own, without the jQuery and have confirmed that it is working, which leads me to believe that the problem is that the jQuery .change() event is not being fired.

I've seen many of the same questions, though none of the solutions seem relevant. How can I get this working?

jQuery:

<script type="text/javascript">
    $(function () {
        $('.qty').change(function () {
            $.post('/InlineEditing.cshtml', { qty: $(this).val(), id: $(this).attr('id') },
                function (data) {
                    alert(data.trim());
                });
        });
    });
</script>

HTML:

<input type="text" class="qty" id="1" value="0" />

Upvotes: 0

Views: 197

Answers (3)

jsalonen
jsalonen

Reputation: 30481

I think there are several aspects to this problem:

  • If you want to update server status on every keypress you could listen to keypress event instead.
  • Also note you possibly should point your HTTP command into a URL that accepts POST commands, not into the rendered HTML.
  • alert is horribly insufficient for debugging what happens in your script. Consider using a JavaScript debugger like Firebug to find out what really gets sent to the server.

For an example, see this fiddle: http://jsfiddle.net/dfH7y/3/ (you need to open JavaScript console to see console.log output)

Upvotes: 0

Hkachhia
Hkachhia

Reputation: 4539

You can write function on Keyup or onblur event instead of change. Change event is suitable in select box.

Upvotes: 0

techfoobar
techfoobar

Reputation: 66663

If you want to reliably handle text changes, use zurb's textchanged event instead. This works for keystrokes, paste operations, cut operations etc.

http://www.zurb.com/playground/jquery-text-change-custom-event

Check this demo: http://jsfiddle.net/JnCXG/

Code:

$('#foo').bind('textchange', function (event, previousText) {   
    console.log('Text changed');
});

Upvotes: 1

Related Questions