Java 多选下拉框 传值到后台

↘锁芯ラ 提交于 2020-03-12 05:26:15

效果图:
在这里插入图片描述
前端代码
1,这里使用的是easyui框架,class="easyui-combobox"定义下拉框样式
2,data-options="multiple:true"意味着对下拉框参数多选,没有设定则默认单选
3,${y.taskname}表示下拉框所要获取的value子段

		<label  style="padding:5px 10px 0px 20px;">任务名称 </label>
            <select name="taskname" id="taskname"  class="easyui-combobox" style="width: 160px; height: 25px;" data-options="multiple:true">
            <c:forEach items="${list1}" var="y" varStatus="status">
                <option value="${y.taskname}">${y.taskname}</option>
            </c:forEach>
            </select>

后端代码
1,在数据库中表cbhs查询下拉框要显示的值
2,使用model.addAttribute(“list1”, list1);向前台传递数据,前端使用${list1}获取

@RequestMapping("/searchpage")
    public String getPage(Model model) {

        String sql1 = "select distinct taskname from cbhs";
        List<Map<String, Object>> list1=jdbcTemplate.queryForList(sql1);
        model.addAttribute("list1", list1);
        
        return "cwhsconfig/costApportionSearch";//前端的页面路径
    }

前端代码
1,这样就处理好了样式,因为我这个下拉框是查询功能的条件参数选值,所以但选择好值之后,就要在前端页面对获取的值进行初步的处理,对字段进行了判断并使用逗号间隔各个值
2,weidatagrid1是自定义的数据网格

var tasknames = $("#taskname").combobox("getValues");
        var tasknamestr ='';
        if (tasknames&&tasknames!='') {
            var tmpStr='';
            var arr = tasknames.join(',').split(',');
            for (var i = 0; i < arr.length; i++) {
                if(arr[i]!=''){
                    if(tmpStr==''){
                        tmpStr=tmpStr+arr[i];
                    }else {
                        tmpStr=tmpStr+","+arr[i];
                    }
                }
            }
            if(tmpStr!=''){
                tasknamestr =tmpStr;
            }
        }
        var fieldValues = {};
        fieldValues.taskname=tasknamestr;
     
        $.ajax({
            type: 'post',
            async: false,
            data: fieldValues,
            url: "/page/getList?rdm=" + parseInt(Math.random() * 100000),//后端路径
            dataType: 'JSON',
            success: function (dataremote) {
                $('#weidatagrid1').datagrid("loadData", dataremote.commonPage.resultlist);
            }
        });

后端代码
1,这里就将前端下拉框的选值使用split函数又变为了字符串数组,后面的随着自己需求进行修改取用

@RequestMapping(value = "getList")
@ResponseBody
public HashMap<String, Object> getList(@RequestParam HashMap<String, Object> param) {
	    String[] tasknames=param.get("taskname").toString().split(",");
        String tasknamestr="";
        for (int i = 0; i <tasknames.length ; i++) {
            tasknamestr+="'"+tasknames[i]+"',";
        }
}
标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!