select多选标签通过 ajax传值 后台无法获取的问题

在项目的进行中,遇到了如题目所示的问题。select标签如下:

//前台的select标签部分

//id="CLASS"是单选标签
<select id="CLASS" name="CLASS" class="selectpicker show-tick form-control" style="width: 30%;" data-live-search="false">
       <option value="1" selected="selected">甲</option>
       <option value="2">乙</option>
       <option value="3">丙</option>
       <option value="4">丁</option>
</select>

//id="TYPE"是多选标签
 <select id="TYPE"  name="TYPE" class="selectpicker show-tick form-control" style="width: 30%;" multiple data-live-search="false">
       <option value="1">业务A</option>
       <option value="2">业务B</option>
       <option value="3">业务C</option>
       <option value="4">业务D</option>
       <option value="5">业务E</option>
</select>

//前台的ajax部分(这里绑定了click事件,在点击button按钮的时候调用这个函数,向后台传值)
function CJ() {
        var CLASS = $("#CLASS").val();
        var TYPE = $("#TYPE").val().toString();//这里后面要进行解释
        $.ajax({
            type: "POST",
            async: false,
            url: "CY.ashx",
            contentType: "application/x-www-form-urlencoded; charset=UTF-8",
            datatype: "json",
            timeout: 1000,
            cache: false,
            data: { CLASS:CLASS,TYPE: TYPE},
            success: function (result) {
            }
        })
    }

刚开始的时候,CJ()函数中var TYPE = $("#TYPE").val().toString();部分我写的是和单选框一样的方法var TYPE = $("#TYPE").val(),在用jq获取val()值的时候,多选框传到后台的一直是null,也就是获取不到值,单选框却可以。

CLASS.png

TYPE.png

后来上网搜了原因,总算找到了原因(原贴地址):

1.ajax的data里传的值必须为字符串,比如{test:xx},xx必须是字符串类型。
2.当你传的值比如上面的xx是一个数组是必须要,xx.toString()
3.当test值,为select多选的结果时:$('#selectid').val(),这个时候获取的是一个数组,注意很重要的一点你在js里面alert打印一个数组Array对象是会显示成字符串的,但是它实际是一个数组对象,你传的时候必须要转换为字符串。

按照他的方法进行修改改为代码中的var TYPE = $("#TYPE").val().toString();,这时候就能正常传值了。

TYPE-1.png
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容