使用ajax给页面的多个下拉框动态赋值

最新推荐文章于 2021-08-05 16:31:40 发布

翱翔未来

最新推荐文章于 2021-08-05 16:31:40 发布

阅读量2.9k

点赞数

分类专栏： java知识文章标签： java ajax html json

本文链接：https://blog.csdn.net/u014346118/article/details/39893773

版权

本文介绍了一种使用Ajax从后台获取数据并动态填充HTML页面中多个下拉框的方法。通过$.post调用Java后台接口，将返回的JSON数据遍历并填充到不同的select元素中，实现页面数据的动态更新。

摘要由CSDN通过智能技术生成

一。前台页面

$.post("${ctx}/basedata/baseData.do?method=queryPlantUnitList",function(data){
            var optionvalue=eval("("+data+")");
              $.each(optionvalue, function(key, val){
                 if(key=="YESORNOT")
                 {
                   var yonval=val;
                    $("#virtualflag option").remove();
                    $("#tlflag option").remove();
                    $("#agcflag option").remove();
                     $("#hotflag option").remove();
                    $("#virtualflag").append("<option value='-1'>请选择</option>");
                    $("#tlflag").append("<option value='-1'>请选择</option>");
                    $("#agcflag").append("<option value='-1'>请选择</option>");
                    $("#hotflag").append("<option value='-1'>请选择</option>");
                    $.each(yonval, function(key, val){
                        $("#virtualflag").append('<option value="' +val.id+ '">' + val.name + '</option>');
                        $("#tlflag").append('<option value="' +val.id+ '">' + val.name + '</option>');
                        $("#agcflag").append('<option value="' +val.id+ '">' + val.name + '</option>');
                         $("#hotflag").append('<option value="' +val.id+ '">' + val.name + '</option>');
                    });
                 }else if(key=="UNITSTATE"){
                   var stateval=val;
                   $("#state option").remove();
                    $("#state").append("<option value='-1'>请选择</option>");
                    $.each(stateval, function(key, val){
                        $("#state").append('<option value="' +val.id+ '">' + val.name + '</option>');
                    });

                 }else if(key