Search code examples
backbone.jsinputbackbone-stickit

Backbone Stickit input value change from outside


I have a datepicker that sets a date on an input. I am binding it with stickit. The problem is that since the datepicker (and not a keystroke) changes the value of the input, the stickit binding doesn't observe the change. If I enter the date manually, there is no problem.

bindings: {
                        'input[name=RecordDate]': {
                            observe: 'recdate',
                            onSet: 'dosome'
                        }
                    },

Solution

  • I would recommend adding a global handler to handle all of the datepickers across your project. The following handler will match any bound element with the class: 'jquery-datepicker':

    Backbone.Stickit.addHandler({
        selector: '.jquery-datepicker',
        initialize: function($el, model, options) {
            $el.datepicker({
                onChangeMonthYear: function() {
                    model.set(options.observe, $el.val());
                }
            });
        }
    });
    

    Here is an example fiddle:

    http://jsfiddle.net/px6UP/29/

    More about handlers.

    Let me know if that works for you. I plan on documenting handlers better with a cookbook or examples in the near future...