ansaurus

Question

How to handle programmatic change of the input element state in javascript

Answer 1

+1 A:

In this case you should not code logic in the event handler function itself. You should place any such logic in a separate function. Similarly you should not place code that manipulates the check boxes value programatically directly in other sequences of code but abstract it into another function:-

jQuery(document).ready(
  function() {

    jQuery("#cb").change(
      function() {
        changeLogicForcb.call(this);
         return true; 
     }
    );

    jQuery("#b").click(
      function() {
         togglecb();            
      });

    function changeLogicForcb()
    {
         //something actually sensible here
         alert("changed!");
    }

    function togglecb()
    {
        var cb = jQuery("#cb");
        var newState = !cb.attr('checked');
        cb.attr('checked', newState);
        changeLogicForcb.call(cb.get(0));         
    }  

  });

AnthonyWJones 2008-12-30 13:11:59

Answer 2

+1 A:

use the trigger function to trigger a click event on the checkbox. You won't need to grab the existing state as the checkbox will just be toggled by the click.

jQuery("#cb").trigger('click');

tvanfosson 2008-12-30 13:12:49

Answer 3

A:

The jQuery core library method .val() does not fire the change event. If you serve your own copy of jQuery, you could modify the library method, but that would probably not be wise. Instead, you could add your own value-setter that leverages .val() while also firing the change event with something along the following lines:

jQuery.fn.xVal = (function() {
    return function(value) {
        // Use core functionality
        result = this.val.apply(this, arguments);
        // trigger change event
        if (result instanceof jQuery) {
              result.change();
        }
        return result;
    };
})();

mfwesq 2010-01-19 14:42:59

Answer 4

A:

It's impossible to track object's state within javascript language as it could be done in Objective-C (KVO). Nor it possible using DOM features - DOM do not fire events on every property change - instead it only fires events on certain user actions: mouse clicks, key presses, or page life cycle and their derivatives.

One could achieve that only firing event every time she modifies some property. Certainly this could be encapsulated in a function as AnthonyWJones had mentioned.

Artem Tikhomirov 2010-01-20 15:27:14

ansaurus

tags:

views:

answers:

How to handle programmatic change of the input element state in javascript

related questions