jquery提交form表单数据,jq获取form表单提交数据
jquery或js前端提交数据的几种方式
1.jquery提交数据的方式:
(1)第一种jquery序列化提交数据方式:
通过id获取的form表单元素.serialize();
(2)第二种模拟form表单提交元素:
$('#form表单id').attr('method','post');
$('#form表单id'').find('input[name="type"]').val(test);
$('#form表单id').find('input[name="dfrom_to1"]').val(dfrom_to);
$('#form表单id').find('input[name="gt_road_new"]').val(gt_road);
$('#form表id').attr('action',AdminLTE.ctx+'/modules/ltegt/findAllCoverAndInterfere.do');
$('#analysisForm').submit();
2.js提交数据的方式:
(1).js提交表单( .submit()方法提交表单 )
function doSearch(){
var action ="%=path%/User_queryAllUser";
document.all.form.action = action;
document.all.form.submit();}
(2).js替代超链接( window.location.href )
input type="button" id="modify" value="修改工号" οnclick="modifyEmp(${ myList.employeeId })"
//js不能起名为modify,为敏感关键字
function modifyEmp( employeeId ){
//employeeId 作为js的参数传递进来
window.location.href = '%=path%/User_openUserUpdate?employeeId='+employeeId;
如何用jqueryajax请求form表单
第一步:引用js
?
!--这里的min是自己用js压缩工具对完整版进行的压缩
并不是真正的min,所以好使--
script?type="text/javascript"?src="js/jquery-1.7.min.js"/script
script?type="text/javascript"?src="js/jquery.form.js"/script
第二步:页面写form
form?id="showDataForm"?
action="/024pm/f_shopUser.do?method=login"?method="post"
?input?type="text"?value=""?name="name"?maxlength="2"/
?input?type="password"?value=""?name="password"?maxlength="2"/
?input?type="submit"?value="提交"/
/form
div?id="output1"?
style="width:1000px;height:200px;"
/div
第三步:写js调用jquery.form.js,对form表单进行ajax提交
$(document).ready(function()?{
?var?options?=?{
??target:?'#output1',
??//?从服务传过来的数据显示在这个div内部
?也就是ajax局部刷新
??beforeSubmit:?showRequest,
?//?ajax提交之前的处理
??success:??showResponse
?//?处理之后的处理
?};
?$('#showDataForm').submit(function()?{
??$(this).ajaxSubmit(options);
??return?false;?
??//非常重要,如果是false,则表明是不跳转
??//在本页上处理,也就是ajax,如果是非false,则传统的form跳转。
?});
});
function?showResponse(responseText,?statusText,?xhr,?$form)?{
?alert(xhr.responseText+"=="+$form.attr("method")+'status:?'?+?
?statusText?+?'\n\nresponseText:?\n'?+?responseText);
//xhr:说明你可以用ajax来自己再次发出请求
//$form:是那个form对象,是一个jquery对象
//statusText:状态,成功则为success
//responseText,服务器返回的是字符串(当然包括html,不包括json)
}
function?showRequest(formData,?jqForm,?options)?{
?//formData是数组,就是各个input的键值map数组
?//通过这个方法来进行处理出来拼凑出来字符串。
?//formData:拼凑出来的form字符串,比如name=herapassword,
?//其实就是各个表单中的input的键值对,
?//如果加上method=XXXX,那也就是相当于ajax内的data。
?var?queryString?=?$.param(formData);
?alert(queryString+"======"+formData.length);
?for?(var?i=0;?i??formData.length;?i++)?{
?alert(formData[i].value+"==============="+formData[i].name);
?}
?//jqForm,jquery?form对象
?var?formElement?=?jqForm[0];
?alert($(formElement).attr("method"));
?alert($(jqForm[0].name).attr("maxlength"));
?//非常重要,返回true则说明在提交ajax之前你验证
?//成功,则提交ajax?form
?//如果验证不成功,则返回非true,不提交
?return?true;
}
options对象内的值有哪些?
var?options?=?{
?target:?'#output1',?
?data:{param1:"我自己的第一个额外的参数"},
//这个参数是指通过ajax来给服务器提交除了form内部input的参数
//在后台中使用String?param1=req.getParameter("param1");获取。
?//?dataType:?null,
?dataType:'json',
//这个参数值的是服务器返回的数据类型,默认的是null
//也就是服务器可以默认返回字符串,然后将这些字符串放在target内部
//当然还有json、xml,其中最常用的便是null和json
//对于span?style="color:?#333333;"a?href=""?target="_blank"span?style="color:?#333333;"json/span/a/span的使用,我们会稍后讲解到
?beforeSubmit:?showRequest,
?success:??successRes,
?type:'POST'
?//提交方式,默认是自己在form标签上指定的method
?//如果没有指定,则使用get。
?url:''
?//重新提交的url,即url可以在form中配置
?//也可以在这里配置。
};
Jquery通过Ajax方式来提交Form表单
ajax提交表单说白了就是,用ajax把数据post都后台去而已。你可以在后台把数据打印一下看看是否成功,再做进一步调试。
js或jQuery如何实现提交form表单,保存数据到数据库,同时打开一个新的窗口,并且带入刚保存的数据的ID
这个建议你用ajax来完成。
以jq的ajax为例
==============
$("#form").submit(function(){
var strArray=$(this).serializeArray();//将form表单转为数组形式序列化表单
$.post("你要提交的后台页面地址",strArray,function(result,status){
//result是由后台返回的id
//status是状态,为success时成功。
if(status=="success"){
window.open("要打开的新窗口地址?id="+result);//打开一个新窗口,并用get方法传入id
}
});
return false;//此句是防止页面提交
});
=================
以上是jq代码。
后台代码,要看你用的是什么语言了。
比如说php,有个msyql_insert_id();可以获取最后一条插入记录的id。
如果是asp,可以用select top 1 id from 表 order by id desc的方法来获取id。
=================
后台插入数据库的代码,就由你自己来写了。
新打开的窗口,只需获取id即可
jquery表单提交数据 的几个方法
jquery表单提交数据的方法有两种:
一种是直接提交,调用submit()方法,
第二种是用ajax提交,ajax提交要注意讲数据序列化。
比如:
1、调用submit()方法
$(表单).submit();
2、ajax提交
$.ajax({
url: url,
data: $(表单).serialize(),
type: 'post',
success: function (data) {
}
});