bootstrap 表单中的select下拉列表数据动态加载和selected

bootstrap 表单中的select下拉列表数据动态加载和selected

bootstrap 表单中的select下拉列表数据动态加载和selected

获取到下拉值

通过ajax进行获取下拉值

获取之后改如何对下拉值进行更新等相关操作

页面

<div class="row clearfix">
    <div class="col-lg-2 col-md-4 col-sm-4 col-xs-5 form-control-label">
        <label>厂房</label>
    </div>
    <div class="col-lg-8 col-md-10 col-sm-8 col-xs-7">
        <div class="form-group">
            <div class="form-line">                                   
                <select asp-for="XXXId" class="form-control" id = "XXXId">
                    <option>请选择</option>
                </select>
            </div>
            <span class="field-validation-error" asp-validation-for="XXXId"></span>
        </div>
    </div>
</div>

JQ

//select下拉联动清除原有的
$("#XXXId").empty();
if(result.length==0)
{
   	//某些有验证的地方 如果不给请选择的value赋值会有验证错误
   	$("#XXXId").append('<option value="">请选择</option>');
}
else
{
    for(var i = 0;i<result.length;i++)
    {
        $("#XXXId").append('<option value ='+result[i].Id+' >'+result[i].XXXName+'</option>');
    };
}
//select下拉联动刷新
$("#XXXId").selectpicker('refresh');
//select下拉联动展示
$("#XXXId").selectpicker('show');

再此记录只为方便自己查询与使用,如能帮到大家,也欢迎大家伙一起浏览学习与讨论

上一篇:Bootstrap 创始人 Mark Otto 谈自己生病;替换 RHEL,SUSE 推出 Liberty Linux ; Linux 5.17 使用新调试功能 | 开源日报


下一篇:基于bootstrap渲染ui页面结构----图书管理