juqery.form.js在提交表单前修改某个值的方法

在表单提交前,可以设置beforeSubmit和beforeSerialize。

可以在beforeSerialize组装发送的表单值之前修改某些表单的值.

也可以在beforeSubmit可以做表单提交前的验证,不通过则可以阻止表单的提交

很多时候表单的数据是在动态的,不是确定的所以需要在表单提交的最后一刻来确定,比如用户发表文章的标签的数据。他可能添了删,删了添。

我想当然,认为在表单提交前做的操作应该是放在beforeSubmit吧,所以我就在beforeSubmit的函数里面做相关操作吧,但是发现发送的ajax请求里面一直没有数据。

换成beforeSerialize之后才有数据这样才能成功的将数据发送到服务器端

beforeSerialize: modifySubmitData,	//提交到Action时,可以自己对某些值进行处理。


$(function(){
	var options={
		    //target : '#output',    // 把服务器返回的内容放入id为output的元素中
		    beforeSubmit : showRequest,    // 提交前的回调函数,做表单校验用
		    beforeSerialize: modifySubmitData,	//提交到Action时,可以自己对某些值进行处理。
		    success : showResponse,    // 提交后的回调函数
		    //contentType: "application/x-www-form-urlencoded;charset=UTF-8",
		    url :'${pageContext.request.contextPath}/jqueryFormPlugin/getForm',    //默认是form的action,如果申明,则会覆盖
		    type : "POST",    // 默认值是form的method("GET" or "POST"),如果声明,则会覆盖
		    dataType : "json"    // html(默认)、xml、script、json接受服务器端返回的类型
		    // clearForm : true,    // 成功提交后,清除所有表单元素的值
		    // resetForm : true,    // 成功提交后,重置所有表单元素的值
		    // timeout : 3000    // 限制请求的时间,当请求大于3秒后,跳出请求
		}

	 // bind form using 'ajaxForm' 
	$('#myForm1').ajaxForm(options); 
	
	$("#search_btn1").click(function () {
		 $("#searchForm1").ajaxSubmit(options);
	});
	
});


function showRequest(formData, jqForm, options){
	//仅用于校验,即使改变了表单的某些值,在前台会有显示,但不改变提交到Action/Controller的值。
	
    // formData: 数组对象,提交表单时,form插件会以ajax方式自动提交这些数据,格式如[{name:user,value:val},{name:pwd,value:pwd}]
    // jqForm: jQuery对象,封装了表单的元素
    // options: options对象
    //var queryString=$.param(formData); // name=1&address=2
    //formData: $('#searchForm1').serialize();
    //var queryCondition = $('#searchForm1').serialize();
    var t1 = jqForm;
    var t2 = formData;
    var t3 = options;
    var queryCondition =$.param(formData);
    var formElement=jqForm[0]; // 将jqForm转换为DOM对象
    var name=formElement.name.value; // 访问jqForm的DOM元素
    $("#name").val("lele李姓名showRequest");
    $("#comment").val("呵呵ll123");
    
    return true; // 只要不返回false,表单都会提交,在这里可以对表单元素进行验证
}

function modifySubmitData(){
	//组装发送的表单值之前修改某些字段的值。在Action/Controller中真正接收的值。
	$("#id").val("lele李");
    $("#name").val("lele李姓名modifySubmitData");
    $("#comment").val("呵呵ll123444");
    
}
function showResponse(responseText,statusText){
    var data = responseText;
    
    if (data.success == true) {
        var retlist = data.result;
        //alert(retlist.length);
      }else{
        alert("error:"+data.responseText);
     } 

}




  • 1
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值