今天学习easyUI的form表单,说他有个ajax提交数据的功能,我在服务器端设置了一道屏障,如果不是ajax请求则跳转到404页面。
结果,每次提交表单都是404了,看了下请求头,根本不是ajax提交。
我对比了一下其他ajax请求头,成功的都会有个 X-Request-With:"XMLHttpRequest" , 但是form的ajax方式就没有easyUI所说的ajax提交是不是假的啊???
我把官方给的几种使用方式都试了,不行啊!!!
别骂我,我只是个刚入门的孩子,什么高级的底层的,一概不懂,只是想知道怎么做才能通过我在服务器端设置的非ajax请求跳转到404的屏障。
是不是跨域了???
应该是假的?!?!?!?!?
easyui的form使用iframe来模拟的,并不是实际的ajax请求,没有X-Request-With这个请求头。。
去掉你这个验证不就好了,干嘛非得验证X-Request-With这个请求头。一定要ajax自己添加onSubmit事件return false阻止表单提交,然后用jQuery.ajax发送表单数据
$('#ff').form('submit', {
url: 'xxxxxxx',
onSubmit: function(){
var isValid = $(this).form('validate');
if (!isValid){
$.messager.progress('close'); // hide progress bar while the form is invalid
}
///////////ajax提交
$.ajax({url:"xxxxxx",data:$(this).serialize(),type:'POST'/*...其他配置*/})
return false;
}
赞同showbo的回答. 查看源码 easyui-form的源码(1.4.2版本的jquery.form.js)
//...省略...
function ajaxSubmit(target, options){
var opts = $.data(target, 'form').options;
$.extend(opts, options||{});
var param = $.extend({}, opts.queryParams);
if (opts.onSubmit.call(target, param) == false){return;}
$(target).find('.textbox-text:focus').blur();
//构造了一个iframe
var frameId = 'easyui_frame_' + (new Date().getTime());
var frame = $('<iframe id='+frameId+' name='+frameId+'></iframe>').appendTo('body')
frame.attr('src', window.ActiveXObject ? 'javascript:false' : 'about:blank');
frame.css({
position:'absolute',
top:-1000,//让我们看不到它
left:-1000
});
frame.bind('load', cb);
submit(param);
function submit(param){
var form = $(target);
if (opts.url){
form.attr('action', opts.url);
}
var t = form.attr('target'), a = form.attr('action');
form.attr('target', frameId);//把我们要提交的form的target指向构造出来的那个iframe
var paramFields = $();
try {
for(var n in param){
var field = $('<input type="hidden" name="' + n + '">').val(param[n]).appendTo(form);
paramFields = paramFields.add(field);
}
checkState();
form[0].submit();
} finally {
form.attr('action', a);
t ? form.attr('target', t) : form.removeAttr('target');
paramFields.remove();
}
//...省略...
看到easyui的作者写了一个ajaxSubmit方法(不仔细看内容还真以为是一个ajax方法呢)。方法里面动态构造了一个隐藏的iframe,然后把我们要提交的form的target指向了构造出来的这个隐藏的iframe,给这个iframe设置了load事件回调方法用来处理响应。重要的是那句“form[0].submit()”,这是什么,这就是直接在提交表单啊,哪儿有什么ajax,只是保证了页面无刷新。