当我们在一些稍微复杂的业务时,可能会遇到需要多个表单form在同一个页面的情况,但是提交一个表单以后不想页面刷新或者跳转,那么我们考虑到的就是Ajax提交表单,那么如何让Jquery的validator插件也可以对异步提交的表单进行验证呢?我们继续往下看。

在这里,我就用网络上的一个例子来说明好了。

下面是一个比较常见的jquery .ajax提交表单的写法

$("#submitButton").click(function(){
//序列化表单
var param = $("#leaveSave").serialize();
$.ajax({
url : "leaveSave.action",
type : "post",
dataType : "json",
data: param,
success : function(result) {
if(result=='success') {
location.href='allRequisitionList.action';
} else if(result.startWith("error_")){
$("#errorMessage").html(result.substring(6));
} else {
//返回的结果转换成JSON数据
var jsonObj = eval('('+result+')');
startTime = $("#startdate").val();
endTime = $("#enddate").val();
hour = jsonObj.hour;
reason = jsonObj.reason; replaceDom(startTime,endTime,hour,reason);
}
}
});
});
如果想用ajax提交表单,还想用jquery的validate进行验证,那么可以这样解决:表单还是正常编写的表单内容,type还是submit类型,只不过在validate验证通过后的方法中使用ajax提交表单

Validator验证Ajax提交表单的方法的更多相关文章

  1. jquery实现ajax提交表单的方法总结

    方法一: 分别获取所需数据元素,DOM结构外层不用包form标签(适用于数据量少,数据元素分散于整个页面) $.ajax({ type: 'POST', url:'', data: { residen ...

  2. 关于ajax提交表单的一些实例及遇到的问题和解决办法

    ajax提交的表单有两种情况: 第一种:input type类型没有file上传文件类型的表单 第二种:input type类型有file上传文件类型的表单 之所以分为两种:是因为原生ajax是不能提 ...

  3. JQuery ajax提交表单及表单验证

    JQuery ajax提交表单及表单验证 博客分类: jsp/html/javascript/ajax/development Kit 开源项目   注:经过验证,formValidator只适合一个 ...

  4. 第一百八十六节,jQuery,验证表单插件,Ajax 表单插件,验证和提交表单

    jQuery,验证表单插件,Ajax 表单插件,验证和提交表单 HTML <form id="reg" method="post" action=&quo ...

  5. Jquery ajax提交表单几种方法

    在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$('#表单ID').serialize();就行了,下面我来介绍两个提交表单数据的方法. ...

  6. Jquery ajax提交表单几种方法详解

    [导读] 在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$( 表单ID) serialize();就行了,下面我来介绍两个提交表单数据的 ...

  7. button 按钮,结合onclick事件,验证和提交表单

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. lavarel框架中如何使用ajax提交表单

    开门见山,因为laravel以post形式提交数据时候需要加{{csrf_field()}}防止跨站攻击,所以当你用ajax提交表单时候自然也要加 在网上看了很多的解决方式,我是用下面这种方法解决的: ...

  9. jquery实现ajax提交表单

    一般情况下,我们提交form表单采用的是submit的方法,典型的场景如下. <form id="thisForm" method="post" acti ...

随机推荐

  1. 简单的mysql封装类

    class mysql{ private $host; private $user; private $pwd; private $dbname; private $charset; private ...

  2. Jcapta

    http://blog.csdn.net/shadowsick/article/details/8575471

  3. ASP.NET Web API 上传文件

    HTML表单: <form id="form1" method="post" enctype="multipart/form-data" ...

  4. ListView优化中ViewHolder要不要定义为static静态内部类?

    给学生讲课的时候,发现存在这个问题,下来百度了下,发现很纠结,涉及到了内部类对外部类的引用,静态类的生命周期等java知识,现总结如下: static class ViewHolder { //定义l ...

  5. 锁ReaderWriterLockSlim介绍

    概述 ReaderWriterLockSlim 表示用于管理资源访问的锁定状态,可实现多线程读取或进行独占式写入访问: 常用的方法: cacheLock.EnterReadLock();//加上读取锁 ...

  6. DIV宽度自动缓慢变化

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  7. c++ 调用dll

    1.首先写一个dll程序并且输出成dll. 新建win32项目,然后在应用程序类型中选择dll. HelloDll.h: #pragma once #ifndef MYDLL_API_EXPORTS ...

  8. ASP.NET 5探险(4):如何把ASP.NET 5从beta4升级到beta5

    (此文章同时发表在本人微信公众号"dotNET每日精华文章",欢迎右边二维码来关注.) 题记:上一篇文章讲述了ASP.NET 5 Beta带来的一些变化,虽然原文最后给出了从bet ...

  9. jquery audio player

    <!DOCTYPE html><html lang="en"> <head>  <meta charset="utf-8&quo ...

  10. Java Socket编程(转)

    Java Socket编程 对于Java Socket编程而言,有两个概念,一个是ServerSocket,一个是Socket.服务端和客户端之间通过Socket建立连接,之后它们就可以进行通信了.首 ...