Javascript / jQuery select element event when selected option is re-selected

Question

I have a simple SELECT, with the jQuery chosen plug-in, that appears on the page many times. At the top of the select is the option to "Add New". The idea is that I show a dialog box if the user clicks on Add New.

Using the jQuery click event, it is easy and works fine the first time. However, if the user cancels out of the dialog box and then clicks on Add New again, the click event does not fire.

I've tried adding a click event handler to the option itself with no success. I've also tried it without the chosen plug in, and no luck. I don't think chosen is the problem.

Here's a simple jsfiddle showing the problem: http://jsfiddle.net/7cMEg/

$('.cls').chosen().change(function() { if ($(this).val()==='-1') alert('clicked'); });

Click on the select box, and pick Add New. An alert will appear. But now that Add New is selected, when you click on the select box and re-click Add New, nothing happens - the click event isn't fired. Is there another event I can use? Any other suggestions (maybe an unstyled hyper link)?

Answer 1

Becuase the event is triggered on change and not on click. As value is not changed on second click so alert is not displayed.

Showing alert on click - fiddle