4

i am trying to bind an event when user selected an item from <select> not necessary changed from the default.

$(select).change(); only works if the item was changed.

i wonder if there is something that works by selecting one of the options even if its the same default option.

$('#page_body').on('select', '.pop_pin_select', function() {
});

This is what i try so far but it wont work.

Neta Meta
  • 4,001
  • 9
  • 42
  • 67
  • Possible duplicate: [HTML select element onchange trigger for already selected option](http://stackoverflow.com/questions/3354367/html-select-element-onchange-trigger-for-already-selected-option). – insertusernamehere Dec 11 '12 at 18:26
  • You probably want to have a blank option to force a `change` event. Selects simply don't work in the way you're trying to make them work. – user229044 Dec 11 '12 at 18:30
  • yea that's the worst case scenario, there is a reason i am trying it this way – Neta Meta Dec 11 '12 at 18:37

1 Answers1

1

There is a way around this; making the option at index 0 the default selected, dynamic and not manually selectable (i.e. disabled) and listen for onchange as normal, except when changing to index 0. Then onchange, set .options[0] to chosen label and value and change selection to it. Here is an example.

Relevant JavaScript from example

document.getElementById('sel')
    .addEventListener('change', function () {
        if (this.selectedIndex === 0) return;
        this.options[0].value = this.value;
        this.options[0].textContent = this.options[this.selectedIndex].textContent;
        this.selectedIndex = 0;
    }, false);​

onchange will fire when a user makes the same selection because the index is changing even though the value isn't.

Paul S.
  • 64,864
  • 9
  • 122
  • 138