jQuery Easyui form 提交验证与 json数据返回结果的处理

来源：互联网发布：域名注册是永久的吗编辑：程序博客网时间：2024/05/01 11:53

简单实现：

// 提交验证$(":submit").click(function(){if(!$("#form1").form("validate")){return false;}});// 提交验证 end

ajax 实现：

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>  <head>    <base href="<%=basePath%>">        <title>Basic DateBox - jQuery EasyUI Demo</title>    <meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0">    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="This is my page"><!--<link rel="stylesheet" type="text/css" href="styles.css">-->    <link rel="stylesheet" type="text/css" href="myPlugin/jquery-easyui-1.3.6/themes/default/easyui.css">    <link rel="stylesheet" type="text/css" href="myPlugin/jquery-easyui-1.3.6/themes/icon.css">    <link rel="stylesheet" type="text/css" href="myPlugin/jquery-easyui-1.3.6/demo/demo.css">    <!-- <script type="text/javascript" src="myPlugin/jquery-easyui-1.3.6/jquery.min.js"></script> -->    <script type="text/javascript" src="myPlugin/jquery-easyui-1.3.6/jquery-1.11.1.min.js"></script>    <script type="text/javascript" src="myPlugin/jquery-easyui-1.3.6/jquery.easyui.min.js"></script>        <!-- javascript -->    <script type="text/javascript">    // 自动加载方法  start    $(document).ready(function(){// 表单验证 start// 邮件地址验证$('#emailId').validatebox({     required: true,    validType: 'email',    missingMessage: '邮件地址不能为空.',    invalidMessage:'请输入正确的邮件地址.'});// 用户名验证$('#usernameId').validatebox({ required: true,validType:['chinese','length[3,6]', 'aaa'],missingMessage: '用户名不能为空.'});// 表单验证 end// extends validatebox rules$.extend($.fn.validatebox.defaults.rules, {    chinese : {// 验证中文validator : function(value) {return /^[\u0391-\uFFE5]+$/i.test(value);},message : '请输入中文.'},length : {// 长度验证validator : function(value, param){var len = $.trim(value).length;return len >= param[0] && len <= param[1];},message : '内容长度介于{0}和{1}之间.'},aaa : {// 随意定义了一个规则validator : function(value){return value == '雪山独孤';},message : '名字为[雪山独孤].'} });// end rules// 提交表单 start$('#ff').form({        url:'testAction.do',        onSubmit: function(param){// 提交之前的回调函数。        param.email = '123@qq.com';// 提交参数        param.username = 'Jacky';                var isValid = $(this).form('validate');// 提交验证        return isValid;  // return false to prevent submit;       },    success:function(data){// 提交成功后的回调函数。        //alert(data);        var data = eval('(' + data + ')');  // change the JSON string to javascript object            if (data.success){            alert(data.message);            alert(data.success);        }    }});    // 提交表单 end         });// 自动加载方法  end    </script>  </head>    <body>  <form id="ff" method="post">    <div style="margin-top:25px;"></div>    <label>邮箱：</label><input id="emailId" style="width:200px;" />           <div style="margin-top:25px;"></div>           <label>用户名：</label><input id="usernameId" style="width:200px;"/> <div style="margin-top:25px;"></div><input type="submit" value="提交"/>  </form>  </body></html>

0 0

jQuery Easyui form 提交验证 与 json数据返回结果的处理

jQuery Easyui form 提交验证与 json数据返回结果的处理