页面引入jquery.validate.min.js

<style>  //引入错误格式
     label.error {
        display: block;
        margin-left: 1em;
        width: auto;
        color: red;
    }
    </style><script type="text/javascript" src="/library/js/jquery.validate.min.js"></script>

要验证的form,必须是form表单,提交不提交的无所谓

<form target="hiddenIframe" id="content">
<div class="modal-body" style="margin-left:110px;">
<label style="float:left" for="fieldType">①字段类型<span style="color:red">*</span>:</label>
<input style="float:left;margin-left:40px;" type="text" name="fieldType" id="fieldType"/>
<br>
<br>
<label style="float:left" for="intro">②字段名称<span style="color:red">*</span>:</label>
<input style="float:left;margin-left:39px;" type="text" name="fieldName" id="fieldName"/>
<br/>
<br/>
<label style="float:left" for="orderNumber">③排序(数字):</label>
<input style="float:left;margin-left:6px;" type="text" name="orderNumber" id="orderNumber"/>
<br/>
<br/>
<label style="float:left" for="isDisable">④使用情况:</label>
<input type="radio" name="isDisable" value="0"/>禁用
<input type="radio" name="isDisable" value="1" checked/>启用
<br/>
<br/>
<label style="float:left" for="remark">⑤备注:</label><br>
<textarea rows="6" cols="40" name="remark" id="remark"></textarea>
<br>
<br>
<div class="error">error:</div> //--------错误显示地方
</div>
<div class="modal-footer">
<input id="insertField" type="button" style="margin-left: 150px;margin-top: 20px;" value="新增数据字典" class="btn btn-primary"></a>
<input type="button" style="margin-left: 150px;margin-top: 20px;" value="取消" class="btn btn-primary" data-dismiss="modal" onclick="javascript:window.location.reload();"></a>
<iframe name="hiddenIframe" id="hiddenIframe" style="display:none"></iframe>
</div>
</form>

js中如下:

//验证方法
function valContent(){
return $("#content").validate({
errorLabelContainer: $("#content div.error"),
rules: {
fieldName: { //fieldName 是页面的name属性
required: true
},
orderNumber:{
number: true,
digits: true,
min :0
}
},
messages: {
fieldName: {
required: "请填写字段名称"
},
orderNumber:{
number: "请输入合法的排序数字",
digits: "排序只能输入整数",
min :$.validator.format("不能小于0")
}
}
}).form();
}

发送的ajax请求如下:

//新增数据字典
$("#insertField").click(function(){
var fieldType = $("#fieldType").val();
var fieldName = $("#fieldName").val();
var orderNumber = $("#orderNumber").val();
var isDisable = $("input[type='radio']:checked").val();
var remark = $("#remark").val();
if(valContent()){
$.post(ctx+"/field/insert",{fieldType:fieldType,fieldName:fieldName,orderNumber:orderNumber,isDisable:isDisable,remark:remark},function(msg){
if(msg.success){
$("#myModal").modal('toggle');
loadSignIn();
}
});
}
});

jquery.validate ajax提交的更多相关文章

  1. 今天在研究jquery用ajax提交form表单中得数据时,学习到了一种新的提交方式

    今天在研究jquery用ajax提交form表单中得数据时,学习到了一种新的提交方式 jquery中的serialize() 方法 该方法通过序列化表单值,创建 URL 编码文本字符串 序列化的值可在 ...

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

    本篇文章主要是对jquery实现ajax提交form表单的方法进行了总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助 方法一:  function AddHandlingFeeToRefund( ...

  3. jQuery Validate Ajax 验证

    jQuery Validate Ajax 验证 <script type="text/javascript"> $(function() { $('#formCityL ...

  4. jquery实现ajax提交表单信息

    最近在思考优化项目,想自己扩展一个jquery自动获取表单中的数据进行ajax提交.本人没有完整性学习jquery,基本上是现学现找,有点困难. 主要是扩展和拼接json转对象 很简单,附上代码: ; ...

  5. jquery validate ajax submit form

    when the jquery validation plugin is used for validating the form data, such as below: html code: &l ...

  6. jquery实现ajax提交表单

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

  7. php使用jquery Form ajax 提交表单,并上传文件

    在html5中我们通过FormData就可以ajax上传文件数据,不过因为兼容问题.我们选用jquery.form.min.js来进行ajax的表单提交.   一.jquery.form.js下载地址 ...

  8. jquery.validate ajax方式验证

    在做网站的时候有一块需要用到jquery.validate插件 ajax方式的方式来验证原始密码是否正确,研究了研究加上博客园朋友的帮助,终于实现了.贴出代码 <script type=&quo ...

  9. jquery validate submitHandler 提交导致死循环

    dom对像的提交form.submit();和jquery对像的提交$('').submit();功能上是没有什么区别的.但是如果用了jquery validate插件,提交时这二个就区别大了.$(' ...

随机推荐

  1. 高效的使用 Response.Redirect

    介绍: 我正在评估一个 ASP.NET Web 项目应用.它有一些可扩展性问题.意味着当网站访问量增加的时候.系统将会变得缓慢.当我查看应用日志.我找到了大量的 ThreadAbortExceptio ...

  2. IIS服务器运行一段时间后卡死,且无法打开网站(IIS管理无响应,必须重启电脑)

    问题描述: 公司希望使用IIS配合网站显示一些订单跟进的情况并展示出来,所以我们在一台演示的Win7 Pro电脑上安装了IIS,但使用了一段时间后发现每过几天页面就无法正常访问了,而且打开IIS管理器 ...

  3. ajax浅析---ScriptManager

    使用ScriptManager控件 它用来处理页面上的所有组件以及页面局部更新,生成相关的客户端代理脚本以便能够在JavaScript中访问Web Service,所有需要支持ASP.NET AJAX ...

  4. 只会CSS还不够,LESS、SASS、BootStrap、Foundation一网打尽!

    有些人想学CSS,不知如何下手:有些人已经学会CSS的各种属性,却不知如何运用:有些人会平面设计,不知道如何与网页设计结合:有些人会HTML,就是学不会CSS.试问自己,图中的技术你都会了吗? 别总是 ...

  5. POJ 2635 The Embarrassed Cryptographer

    大数取MOD... The Embarrassed Cryptographer Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 1 ...

  6. JS补充

    JavaScript JavaScript 使用那些老旧的实例可能会在 <script> 标签中使用 type="text/javascript".现在已经不必这样做了 ...

  7. PHPCMS V9多站点[站群功能]动态设置与静态设置子站内容URL

    今天我们来讲解下 PHPCMS V9的站群功能的 动态站点与静态站点的配置 站群站点,分为动态站点,和静态站点两种设置方法: 静态的,就是将栏目和内容都了HTML 文件,我们先讲解下,站群的操作: 建 ...

  8. HDU 2795

    题目: http://acm.hdu.edu.cn/showproblem.php?pid=2795 线段树问题,线段树的每个叶子节点保存的是当前行还剩余的长度,每次查询找到满足条件的一行减去该条幅的 ...

  9. 热更新脚本C#light,ulua,Scorpio性能比较

    http://www.unity蛮牛.com/thread-32861-1-1.html 测试环境: unity4.5.2  三个脚本全是源码导入  PC :处理器 Intel(R) Core(TM) ...

  10. 我要阻止做java开发的男朋友去创业型公司工作吗?

    命这样的标题,我没有瞧不起创业型公司,我只是有点急了,因为男朋友今天晚上就要回复招聘公司了.我先来说说来由吧. 前段时间男朋友离职了,从毕业到现在在公司呆了2年多,因为资金不足导致他做的项目被迫停止了 ...