web-dev-qa-db-fra.com

JQuery - Obtenir la valeur select

J'essaie d'obtenir la valeur sélectionnée à partir d'une liste déroulante via jQuery. J'ai un peu de javascript qui valide un formulaire lorsque je clique sur Envoyer, pour m'assurer qu'il n'y a pas de blancs, le code est le suivant:

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;
        }

Dans ce cas, la nationalité est la valeur que je veux. Comme vous pouvez le voir, j'ai essayé:

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

qui ne semble pas fonctionner.

Si je mets la déclaration d'alerte suivante: alert (obj.options [obj.selectedIndex] .text); après la casse "select-one", la valeur correcte est sortie afin que je sache qu'elle est passée correctement.

Je ne sais tout simplement pas comment le capturer dans la fonction sendDetailsDancer.

Toute aide appréciée.

Cordialement, Stephen

61
Stephen

var nationality = $("#dancerCountry").val(); devrait fonctionner. Êtes-vous sûr que le sélecteur d'élément fonctionne correctement? Peut-être devriez-vous essayer:

var nationality = $('select[name="dancerCountry"]').val();
107
BenM

val () renvoie la valeur de l'élément <select>, c'est-à-dire l'attribut value. de l'élément <option> sélectionné.

Puisque vous voulez réellement le texte intérieur de l'élément <option> Sélectionné, vous devez faire correspondre cet élément et utiliser text () à la place:

var nationality = $("#dancerCountry option:selected").text();
48
Frédéric Hamidi