ajax 二级联动与springmvc 交互

Posted 2020-10-29 javaobject

 

html  测试可以使用

<div class="pageButton" style="height: 60px;margin: 10px;line-height: 30px;">
                          <form id="pageform" action="${basePath}/back/userChannel/list.action" method="post">
                              <input type="hidden" id="currentPage" name="currentPage"/>
                            登录名：<input type="text" name="userChannel.loginName" value="${userChannel.loginName}"/>&nbsp;

                            通道类型：<select name="userChannel.type" id="type">
                            <option value="">全部</option>
                            <option value="1">京东钱包</option>
                            <option value="2">QQ</option>
                            <option value="3">微信</option>
                            <option value="4">支付宝</option>
                            <option value="5">H5</option>
                            <option value="6">银联二维码</option>
                            <option value="7">快捷支付</option>
                            <option value="8">代付</option>
                        </select>&nbsp;
                            通道：<select name="userChannel.channelId" id="channelId">
                                    <option value="">全部</option>
                                    <s:iterator value="tchannelList">
                                        <option value="${code}" <s:if test="userChannel.channelId == code">selected="selected"</s:if>>${name}</option>
                                    </s:iterator>
                                </select>&nbsp;

 

js:

//异步请求经数据写入下拉选中
$(function(){
    //二级联动异步请求将数据写入下拉选
    $("#type").change(function(){

        var obj = $("#type option:selected");
        var  payType  = obj.val();
        alert(payType);
        var channelId=$("#channelId");
//=============
        $.ajax({
            type:‘post‘,
            url:‘queryTchannelList.action‘,
            data:‘userIds=‘+payType,
            dataType:‘text‘,
            success:function(msg){
                $("#channelId").empty();
                var jsons =JSON.parse(msg);//需要将返回json字符串转换成json对象以后遍历
                for(var i = 0; i < jsons.length; i++) {
                    alert(jsons[i].name);
                    channelId.append(‘<option value="‘+jsons[i].id+‘">‘+jsons[i].name+‘</option>‘);
                }

            },
            error:function(){
                alert("获取通道列表失败！！！！！");
                //alert("操作出错，请与管理员联系！");
            }
        });
    });
});