How to get a selection option in jQuery

Question

I have a question about jQuery. Let's say I have a dropdown list:

 <select id="Positions" name="PositionType"> 
        <option value="Manager">Manager</option> 
        <option value="Janitor">Janitor</option> 
        <option value="Cook">Cook</option> 
        <option value="Cashier">Cashier</option> 
        <option value="Other">Other</option> 
  </select>

How could I display an alert box when "other" is selected? So far this does not work:

  <script type="text/javascript"> 
      $(document).ready(function(){
          $("#position").change(function(){
              if($("#position option:selected").val() == "other"){
                  alert("hello world");
              }
              else { 

              }
          });
      }); 
  </script>

Mike Sherov · Accepted Answer · 2010-01-30 19:53:47Z

2

Two things. First, as others have mentioned, "other" needs to be uppercase as string comparison is case sensitive. Second, you could retrieve the value of a select much easier:

  <script type="text/javascript"> 
      $(document).ready(function(){
          $("#position").change(function(){
              if($(this).val() == "Other"){
                  alert("hello world");
              }
              else { 

              }
          });
      }); 
  </script>

A select element's value is equal to the value of it's selected option :-)

answered Jan 30, 2010 at 19:53

Mike Sherov

13.4k9 gold badges43 silver badges64 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Steven Over a year ago

Thanks, I didn't realize the case sensitive part. I replaced my script with yours, but it's still not working :-( Any more suggestions? Here's my test site in case the HTML is wrong: box.net/shared/a0v69odcvu

Mike Sherov Over a year ago

the box link you sent is broken, but I think the problem might be that in the jquery, you have the id as #position, and in the HTML, you have it as "Positions"

Steven Over a year ago

I ended up deleting the file and reuploading it so here's a working link: box.net/shared/fekilcq1i9

Steven Over a year ago

Yes, that worked. This issue has resolved. Thanks for your help!

Mike Sherov Over a year ago

yup, that was it, change "#position" to "#Positions" to match the HTML

Yaakov Shoham · Accepted Answer · 2010-01-30 19:16:34Z

0

In your script, try "Other" with capital-O.

answered Jan 30, 2010 at 19:16

Yaakov Shoham

10.7k7 gold badges41 silver badges47 bronze badges

1 Comment

jerone Over a year ago

Or put .toLowerCase() after the .val().

Collectives™ on Stack Overflow

How to get a selection option in jQuery

2 Answers 2

5 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related