无法检索“动态选择”框的值

时间:2015-09-09 04:46:38

标签: javascript jquery

我创建了一个按钮,用于检索两个选择框的值。我可以获得$("#parent_selection_pbrand").val(value.CellphoneBrand);的值,但$("#child_selection_pmodel").val(value.CellphoneModel);不会在选择框中显示值。对此的任何帮助都非常感谢。提前谢谢。

function retrieveListItems() {
var title = $("#txtTitle").val();
var siteUrl = _spPageContextInfo.webAbsoluteUrl;
var fullUrl = siteUrl + "/_api/web/lists/GetByTitle('ComputerEquipment')  /items?"+
    "$select=Id,Title,Department,Location,CellphoneBrand,CellphoneModell,CellphoneIMEI&$filter=(Title eq '"+title+"')";

$.ajax({
    url: fullUrl,
    type: "GET",
    headers: {
        "accept": "application/json;odata=verbose",
        "content-type": "application/json;odata=verbose",
    },
    success: onQuerySucceeded,

});

        function onQuerySucceeded(data) {
            var listItemInfo = '';
         $.each(data.d.results, function (key, value) {
        $("#parent_selection_pbrand").val(value.CellphoneBrand);
        $("#child_selection_pmodel").val(value.CellphoneModel);}

HTML代码

<strong>Brand:</strong>
        <div class="wrapper">
                <select name="parent_selection_pbrand" id="parent_selection_pbrand">
                    <option value="">--Please Select--</option>
                    <option value="Apple">Apple</option>
                    <option value="Samsung">Samsung</option>
                </select>
<select name="child_selection_pmodel" id="child_selection_pmodel">
</select>

的JavaScript

var Apple = [
                {display: "iPhone5", value: "iPhone5" }, 
                {display: "iPhone6", value: "iPhone6" }]; 

var Samsung = [
                {display: "Samsung S5", value: "Samsung S5" }, 
                {display: "Samsung S6", value: "Samsung S6" }]; 

            //If parent option is changed
            $("#parent_selection_pbrand").change(function() {
                    var parent = $(this).val(); //get option value from parent 

                    switch(parent){ //using switch compare selected option and populate child
                          case 'Apple':
                            listphone(Apple);
                            break;
                          case 'Samsung':
                            listphone(Samsung);
                            break;              
                        default: //default child option is blank
                            $("#child_selection_pmodel").html('');  
                            break;
                       }
            });

            //function to populate child select box
            function listphone(array_list)
            {
                $("#child_selection_pmodel").html(""); //reset child options
                $(array_list).each(function (i) { //populate child options 
                    $("#child_selection_pmodel").append("<option value=\""+array_list[i].value+"\">"+array_list[i].display+"</option>");

                });
                }

1 个答案:

答案 0 :(得分:0)

.val()元素上设置<select>仅在<option>内有相应<select>元素的情况下才有效。如:

<select id="child_selection_pmodel">
    ...
    <option value="test">Test</option>
</select>

如果我在这种情况下$("#child_selection_pmodel").val("test"),则会更改为选项Test。否则就不会有可见性发生。在您的情况下,似乎在填充后value.CellphoneModel中没有值为child_selection_pmodel的选项。

如果您想将其添加到<select>,可以使用.append()

$("#child_selection_pmodel").append("<option value='...'>...</option>");