Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

JQuery - Get select value

Tags:

jquery

select

I'm trying to get the selected value from a drop down list via jQuery. I have a bit of javascript that validates a form when I click SEND, to make sure there are no blanks, code is as follows:

function formCheckDancer(formobj){                               // Enter name of mandatory fields             var fieldRequired = Array("dancerStageName", "dancerFullName", "dancerPhone", "dancerEmail", "dancerCountry", "dancerAvailableDate");              // Enter field description to appear in the dialog box             var fieldDescription = Array("Stage Name", "Full Name", "Phone Number", "Email Address", "Nationality", "Availability");              // dialog message             var alertMsg = "Please complete the following fields:\n";                        var l_Msg = alertMsg.length;              for (var i = 0; i < fieldRequired.length; i++){                 var obj = formobj.elements[fieldRequired[i]];                                if (obj){                     switch(obj.type){                     case "select-one":                                               if (obj.selectedIndex == -1 || obj.options[obj.selectedIndex].text == "" || obj.options[obj.selectedIndex].text == "..."){                             alertMsg += " - " + fieldDescription[i] + "\n";                         }                         break;                     case "select-multiple":                         if (obj.selectedIndex == -1){                             alertMsg += " - " + fieldDescription[i] + "\n";                         }                         break;                     case "text":                     case "textarea":                         if (obj.value == "" || obj.value == null){                             alertMsg += " - " + fieldDescription[i] + "\n";                         }                         break;                     case "checkbox":                         if (obj.checked == false){                                               alertMsg += " - " + fieldDescription[i] + "\n";                         }                         break;                     default:                     }                     if (obj.type == undefined){                         var blnchecked = false;                         for (var j = 0; j < obj.length; j++){                             if (obj[j].checked){                                 blnchecked = true;                             }                         }                         if (!blnchecked){                             alertMsg += " - " + fieldDescription[i] + "\n";                         }                     }                 }             }              if (alertMsg.length == l_Msg){                 return sendDetailsDancer(); //Send email if all field are populated.                 return true;                             }else{                 alert(alertMsg);                 return false;             }         }          function sendDetailsDancer(){                                    var stagename = $("input[name=dancerStageName]").val();                      var fullname = $("input[name=dancerFullName]").val();             var phone = $("input[name=dancerPhone]").val();             var email = $("input[name=dancerEmail]").val();                                                                                                          var nationality = $("#dancerCountry").val();                         var availability = $("input[name=dancerAvailableDate]").val();                  $("#contact_form_result_dancer").html('<center><img src="loading.gif" width="32" height="32" /></center>');             $("#contact_form_result_dancer").show();             $.post("http://localhost/lapello/wp-content/themes/lapello/sendMailDancer.php", {stagename: stagename, fullname: fullname, phone: phone, email: email, nationality: nationality, availability: availability}, function (data){                 $("#contact_form_result_dancer").html(data);                         });             setTimeout("contactReturnDancer()", 4000);             return false;         } 

In this case Nationality is the value I want. As you can see I've tried:

var nationality = $("#dancerCountry").val(); 

which doesn't seem to work.

If I put the following alert statement: alert(obj.options[obj.selectedIndex].text); after case "select-one" the correct value is output so I know its being passed correctly.

I'm just not sure how to capture it in the sendDetailsDancer function.

Any help appreciated.

Regards, Stephen

like image 744
Stephen Avatar asked Jul 15 '11 12:07

Stephen


People also ask

How do I get the select box value?

Answer: Use the jQuery :selected Selector You can use the jQuery :selected selector in combination with the val() method to find the selected option value in a select box or dropdown list.

How can I get multiple selected values of select box in jQuery?

With jQuery, you can use the . val() method to get an array of the selected values on a multi-select dropdown list.

How do I select a specific Dropdownlist using jQuery?

Syntax of jQuery Select Option$(“selector option: selected”); The jQuery select option is used to display selected content in the option tag. text syntax is below: var variableValue = $(“selector option: selected”).


1 Answers

var nationality = $("#dancerCountry").val(); should work. Are you sure that the element selector is working properly? Perhaps you should try:

var nationality = $('select[name="dancerCountry"]').val(); 
like image 173
BenM Avatar answered Sep 26 '22 03:09

BenM