CODEWITHSUNDEEP
javascriptjqueryhtml
U.C
U.C

Reputation: 183

Click the same option again in a select with JQuery

I have the next code with a Select:

http://jsfiddle.net/pdkg1mzo/18/

The problem is that I want to launch the alert every time a select option is clicked, although the option that was clicked is the one that is currently selected.

Upvotes: 0

Views: 802

Answers (4)

ecodL
ecodL

Reputation: 43

I think you can't do this, but perhaps you can try Chosen: https://plugins.jquery.com/chosen/. I don't know why do you want to do this, do you want to reload de page, load Ajax results. Maybe it is unnecessary for user experience and you will not improve it at all.

Upvotes: 0

Prakhar omer
Prakhar omer

Reputation: 21

try this, 

<select class="normal" name="mysel" onChange="show(this);">
<option value="18">John</option>
<option value="18">Lorry</option>
<option value="19">Jerry</option>
<option value="20">Smith</option>
</select>

pure javascript

<script>
function show(m){
var k=m.options[m.selectedIndex].value;
alert(k);
}
</script>

Try this it perfectly works.

Upvotes: 0

benjamin c
benjamin c

Reputation: 2338

Try this,

$(function(){
    $(".normal option").on("click",function(){
        alert("trigger");
    });
});

Upvotes: 1

Ethan Ryan
Ethan Ryan

Reputation: 500

This may work:

$(function(){
    $(".normal").on("change",function(){
    	//alert("trigger");
      var selectedName = $('#selectId').find(":selected").text();
      console.log('selectedName is: ', selectedName)
      alert(selectedName)
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="normal" id="selectId">
    <option value="18">John</option>
    <option value="18">Lorry</option>
    <option value="19">Jerry</option>
    <option value="20">Smith</option>
</select>

You could add a half second delay to the alert, so it shows the name after the selection has been made:

$(function(){
    $(".normal").on("change",function(){
    	//alert("trigger");
      var selectedName = $('#selectId').find(":selected").text();
      console.log('selectedName is: ', selectedName)
      setTimeout(function () {
      //do something once
      alert(selectedName)
      }, 500);
      });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="normal" id="selectId">
    <option value="18">John</option>
    <option value="18">Lorry</option>
    <option value="19">Jerry</option>
    <option value="20">Smith</option>
</select>

Upvotes: 0

Related Questions