点击提交按钮,控制台无异常,进入Ajax请求后,数据传输不到后台,后台debug断点未进入。将type="submit"删除后,此时数据可以进入后台,但是请求成功之后,页面跳转不到新页面。
改了多次还是失效。后面发现把按键类型改成“button”,就解决了,可以成功请求并跳转。
因为这里没有走form表单的提交,而是自己组装了json数据,再用Ajax调用后台,所以这里不能使用submit按钮,不然就会导致自己的cilck事件请求一次Ajax,然而还未成功就被submit事件打断了,所以数据都无法进入后台。
后面删除“submit”,可以成功请求Ajax了,但是成功后,还是回到原页面,无法跳转,此时搜了很多,后面试了下将type属性改为“button”就可以了,这个我还是没发现原因,不知道为啥不改成“button”就无法跳转新页面。不过猜测还是form表单的问题,因为这个div也是写在form表单内,估计是默认为submit按钮了,所以不执行success内的内容。
这个问题困扰了挺久的,所以以后还是要好好检查页面
<div class="row margin-top-20 text-align-center">
<div class="col-sm-12">
<button type="submit" id="confirmList" class="btn btn-blue">确认提交</button>
<button type="button" class="btn btn-default" onclick="history.go(-1);">取消返回</button>
</div>
</div>
js代码如下
//提交
$("#confirmList").click(function(){
//提交校验
var accountNames=$("select[name='accountName']");
for (var i=0;i<accountNames.length;i++){
$(accountNames[i]).parent().find('small').html("");
if (accountNames[i].value==""){
$(accountNames[i]).parent().find('small').html("请选择账户名称");
$(accountNames[i]).css({"border":"1px solid #e7bebe","color":"#e46f61", "background-color":"#fffafa"});
$("#confirmList").prop("disabled","true");
return false;
}else {
$(accountNames[i]).parent().find('small').html("");
$("#confirmList").removeAttr("disabled");
}
}
var platform = $("#platform").val();
var name = $("#name").val();
var note = $("#note").val();
if (platform ==""){
$("#platform").parent().find('small').html("请选择银企直连平台");
$("#platform").css({"border":"1px solid #e7bebe","color":"#e46f61", "background-color":"#fffafa"});
$("#confirmList").prop("disabled","true");
return false;
}
if (name ==""){
$("#name").parent().find('small').html("请输入平台名称");
$("#name").css({"border":"1px solid #e7bebe","color":"#e46f61", "background-color":"#fffafa"});
$("#confirmList").prop("disabled","true");
return false;
}
var bankFlowRlSettingDTOS = [];
for(var i=0;i<accountNames.length;i++){
var accountId = $(accountNames[i]).parents('tr').find('[name="accountId"]').val();
var bank = $(accountNames[i]).parents('tr').find('[name="bank"]').val();
var account = $(accountNames[i]).parents('tr').find('[name="account"]').val();
var accountName = $(accountNames[i]).parents('tr').find("option:selected").html();
bankFlowRlSettingDTOS.push({"accountId":accountId,"bank":bank,"account":account,"accountName":accountName});
}
if (bankFlowRlSettingDTOS.length == 0){
layer.msg("关联收款账户不能为空!",{icon:0,time:1500});
return false;
}
var bankFlowSettingDTO={
platform:platform,
name:name,
note:note,
bankFlowRlSettingDTOS:bankFlowRlSettingDTOS
}
$.ajax({
url:"/bankFlowSetting/save.htm",
type: "post",
dataType: "json",
async:false,
data: JSON.stringify(bankFlowSettingDTO),
headers:{
'Content-Type':'application/json;charset=UTF-8',
},
success: function (data) {
if (data.code==200){
layer.msg("保存成功",{icon:1,time:1500},function () {
window.location.href="/bankFlowSetting/list.htm";
})
}else {
layer.msg("保存失败:"+data.msg,{icon:2,time:1500},function () {
window.location.href="/bankFlowSetting/list.htm";
})
}
}
})
});