form表单提交option多选框，后台接收处理

有时候页面新增数据的时候一条一条添加很麻烦，操作很不友好，就需要点选很多次，这个时候多选框就很方便，传多个值到后台，后台处理再循环添加更方便一点，一般参数提交我们更多选用的是form表单提交的格式

form表单是根据name值确认给后台传的，因为一个对象，多选的name值一样它最终只会传一个值到后端，这就很烦了，除非不用form表单提交，而是把所有的参数都拼接起来使用传值，但是这样如果页面有改动，js相应的就需要改，后续维护很不友好

最后的结果是后端接收的对象增加一个字段用来接收多选框，多选框的值则按照form表单提交的规则拼接在后面

代码如下：

$("body").on("click", "#addSubmitBtn", function () {
        var optTypes = [];
        $("input[name='optType']:checked").each(function (i) {
            optTypes[i] = $(this).val();
        })
        var params = $("#addForm").serialize();
        params+="&optTypes="+optTypes;
        jQuery.ajax({
            type: "POST",
            url: projectName + "/thirdPayType/save",
            data: params,
            traditional: true,
            success: function (msg) {
                msg = JSON.parse(msg);
                if (msg.success) {
                    promptinfo("添加成功");
                    $("#addWindow #addCancleBtn").click();
                    setTablePageData(currentPage, pageSize);
                } else {
                    promptinfo(msg.message);
                }
            }
        });

    });

form表单提交的格式就是&字段名=字段值，这样的格式，拼接后，后台回获取到一个string类型“，”隔开的字符串再处理

public  Map<String, Object> save(PayTypeVO PayType){
		String optTypes = PayType.getOptTypes();
		String[] split = optTypes.split(",");
		for (String a:split){
			PayType.setOptType(Integer.parseInt(a));
			String currentLoginName = sysUserService.getCurrentLoginName();
			PayType.setEditor(currentLoginName);
			int insert = PayTypeService.insert(PayType);
			if(insert<=0){
				throw new CommonException("保存数据失败");
			}
		}
		return Maps.newHashMap();
	}

这样就可以把多选的值变成一条条保存起来，页面点选也比较方便

以上

最后

你要成为一个独特的自己，而不是伪装成一个完美的别人