Question

我的问题是在浏览器中我的动态多下拉选择列表根本没有显示！我正在使用这样的附加方法。

我有两个下拉，当点击第一个下拉菜单中的项目时，显示数据来限制dro pdown（是多个），但是在secound下拉列表中显示数据，但是数据加载为HTML（当使用chrome进行密码下拉时）

secound下拉（多个）： secound drop down

and insept dropdown： insept dropdown

HTML code：

<div class="form-group">
	<div class="col-md-4">
		<select name="brand" id="brands" class="form-control"
				onchange="populate_models()">
			<option value="">برند</option>
			@foreach ($data as $catt)
				<option value="{{ $catt['id'] }}">{{ $catt['name'] }}
					( {{$catt['count']}} )
				</option>
			@endforeach
		</select>
	</div>
</div>

<div class="form-group">
	<div class="col-md-4">
		<select class="col-md-4" name="model[]" id="models" multiple="multiple">
			<option value="all">نام</option>
			
		</select>
	</div>
</div>

和我的jquery代码：

var populate_models;
    $(document).ready(function () {
        populate_models = function () {
            var brand_id = $('#brands').val();
            var address = '{{route('home.get_brands')}}' + '/' + brand_id;
            $.getJSON(address, function (data) {
                //console.log(data);
                var models_dropdown = $("#models");
                models_dropdown.empty();

                var all_models = $("<option />");
                all_models.html("نام");
                all_models.val("all");
                models_dropdown.append(all_models);

                $(data['models']).each(function () {
                    var option = $("<option />");
                    option.html(this.cat_name);
                    option.val(this.id);
                    models_dropdown.append(option);
                });

            });
        }
    });

Answer 1

根据文档，您需要在填充选择选项后调用multiselect方法。

尝试类似

的内容

$(document).ready(function(){
            $("#models").multiselect();
        });
        var data = {"years":[{"model":"2011"}],"models":[{"cat_name":"کورولا","id":"8"},{"cat_name":"کمری","id":"19"},{"cat_name":"لندکروز","id":"20"},{"cat_name":"هایلوکس","id":"21"},{"cat_name":"یاریس","id":"22"}]};
        function show(){
            var models_dropdown = $("#models");
                models_dropdown.empty();

                var all_models = $("<option />");
                all_models.html("نام");
                all_models.val("all");
                models_dropdown.append(all_models);

                $(data['models']).each(function () {
                    var option = $("<option />");
                    option.html(this.cat_name);
                    option.val(this.id);
                    models_dropdown.append(option);
                });
            $("#models").multiselect('rebuild');
        }

我在这里打电话给$("#models").multiselect();这将最初创建下拉列表，

show（）是你ajax调用的复制。

在此处，您需要重建多重选择。

$("#models").multiselect('rebuild');

Reference Doc

Answer 2

非常感谢你的帮助，我的问题已经解决了。只需在我的代码中添加此代码。

$("#models").multiselect('rebuild');

动态多个下拉列表，附加方法不起作用

2 个答案: