下拉人口显示没有数据

时间:2016-07-15 12:31:49

标签: javascript jquery html

我已经编写了一个脚本,我需要根据使用j-query选择另一个下拉列表来填充下拉列表,但是当我选择第一个下拉列表时,另一个下拉列表显示没有数据,请帮助原谅我,如果我在某处出错了!

script.html

<div class="form-group">
   <select id="json-one" class="form-control">  
     <option selected="" value="base">Please Select</option>  
     <option value="Doctor">Doctor</option>  
     <option value="Engineer">Engineer</option>  
     <option value="Lawyer">Lawyer</option>  
    </select> 
 </div>

<div class="form-group">
    <select id="json-two" class="form-control">  
        <option>Please choose from above</option>  
    </select>  
</div>


<script>
    var data = {
"Doctor":"General,specilist",
"Engineer":"Computers,electronic"
"Lawyer":"Civil,Criminal"
};
$("#json-one").change(function() {

                var $dropdown = $(this);

                //$.getJSON("data.json", function(data) {

                    var key = $dropdown.val();
                    var vals = [];

                    switch(key) {
                        case 'Doctor':
                            vals = data.Doctor.split(",");
                            break;
                        case 'Engineer':
                            vals = data.Engineer.split(",");
                            break;
                        case 'Lawyer':
                            vals = data.Lawyer.split(",");
                            break;
                        case 'base':
                            vals = ['Please choose from above'];
                    }

                    var $jsontwo = $("#json-two");
                    $jsontwo.empty();
                    $.each(vals, function(index, value) {
                        $jsontwo.append("<option>" + value + "</option>");
                    //});

                });
            });
    </script>

2 个答案:

答案 0 :(得分:0)

你的代码应该可以正常工作,但你需要关心两件事。

1:你应该有一个data.json文件。

2:data.json中的JSON对象应该与在get JSON的成功回调中使用它的结构相同

{
  "beverages": "coke,pepsi",
  "snacks":"chips,biscuit"
}

你可以看到它在下面的plunker中工作。

Plunker:http://plnkr.co/edit/2dI09RIDuFGc9XMKXU1h?p=preview

答案 1 :(得分:0)

我在this小提琴中检查了与您相同的代码。

唯一的区别是我没有异步加载json。因此,您需要检查json部分的加载,或者该文件是否存在于该位置。

UITextField.appearanceWhenContainedInInstancesOfClasses([UISearchBar.self]).defaultTextAttributes = [NSForegroundColorAttributeName : UIColor.whiteColor()]
        UITextField.appearanceWhenContainedInInstancesOfClasses([UISearchBar.self]).attributedPlaceholder = NSAttributedString(string: "", attributes: [NSForegroundColorAttributeName : UIColor.whiteColor()])
        UITextField.appearanceWhenContainedInInstancesOfClasses([UISearchBar.self]).tintColor = UIColor.whiteColor()

  UISearchBar.appearance().setImage(UIImage(named: "searchBarSearchIcon"), forSearchBarIcon: UISearchBarIcon.Search, state: UIControlState.Normal)
        UISearchBar.appearance().setImage(UIImage(), forSearchBarIcon: UISearchBarIcon.Clear, state: UIControlState.Normal)

如果您还有其他需要,请告诉我。