Chosen: .chosen().change() not working

Created on 7 Dec 2011  ·  8Comments  ·  Source: harvesthq/chosen

Hi, I am wanting to update the the options in one chosen based on the value selected in another, using AJAX.

I have the underlying AJAX code working great on standard selects, but when I try either of the following two code snippets to trigger a change, it does not work.

I get the alert() on page load, but not when I change the value of the select with id "categories"

[code]

$("#categories").chosen().select(alert());
$("#categories").chosen().change(alert());

[/code]

All 8 comments

Fixed by wrapping it in

$(document).ready(function() {

});

I am seeing the same behavior - I have it wrapped in:

$(document).ready(function() {
    $(".chzn-select").chosen().select(alert());
});

I am using jquery 1.7.1

@samkuehn

Sam - were you able to resolve this? I'm working with it now and the below code is not logging anything in my console.

$(document).ready(function () {
    $('#season').chosen().change(function () {
        console.log('asdf');
    });
});

@bkuhl It has been some time but I think this is what ended up working for me:

$(".chzn-select").chosen().change(function (event) {
    log('change', event, $(event.target).val());
});

it helps for me just roll back to 0.9.5 version :)

  var choice, close_link,
                _this = this;
            choice = $('<li />', {
                "class": "search-choice"
            }).html("<span>" + item.html + "</span>");
            if (item.disabled) {
                choice.addClass('search-choice-disabled');
            } else {
                close_link = $('<a />', {
                    "class": 'search-choice-close',
                    'data-option-array-index': item.array_index
                });
                close_link.bind('click.chosen', function(evt) {
                    return _this.choice_destroy_link_click(evt);
                });
                choice.append(close_link);

want to ask,how to addClass to <span>?

This works perfectly for me. If someone was looking for CoffeeScript implementation, its here:

$('.myselect').chosen().change(
    (event) ->
        console.log "data changed"
)  

i have same thing here. no solution worked for me!

Was this page helpful?
0 / 5 - 0 ratings