<%@ page language="java" contentType="text/html; charset=UTF-8"

    pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>测试表单</title>

<script type="text/javascript" src="js/jquery-easyui-1.4.4/jquery.min.js"></script>

<link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.4.4/themes/default/easyui.css">

<link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.4.4/themes/icon.css">

<script type="text/javascript" src="js/jquery-easyui-1.4.4/jquery.easyui.min.js"></script>

<script type="text/javascript" src="js/jquery-easyui-1.4.4/locale/easyui-lang-zh_CN.js"></script>

<script type="text/javascript">

$(function(){

    $("#myform").form({

        novalidate:false,

        url:'TestSubmit',

        onSubmit:function()

        {

            var isValid = $(this).form('validate');

            //alert('表单测试=' + isValid);

            if(!isValid)

                {

            $.messager.show({

                title:'表单验证',

                msg:'验证未通过'

            })

                }

            return isValid;

        },success:function(data){

            alert(data);

        }

    })

    $("#subbutton").click(function(){

        $("#myform").form('submit');

    })

})

</script>

</head>

<body>

<div id="mypanel" title="用户信息"  class="easyui-panel" style="width:220px;height:400px;">

<form id='myform' method="post">

<table>

<tr>

<td>用户名称:</td>

<td><input width=30 class="easyui-textbox"

data-options="required:true,validType:'length[2,5]',missingMessage:'必须填写用户名'"/></td>

</tr>

<tr>

<td>用户邮箱:</td>

<td><input width=30 class="easyui-textbox"

data-options="required:true,validType:'email',invalidMessage:'请填写有效的邮箱'"/></td>

</tr>

<tr>

<td>个人主页:</td>

<td><input width=30 class="easyui-textbox"

data-options="required:false,validType:'url',prompt:'提示信息',iconCls:'icon-search'"/></td>

</tr>

<tr>

<td>密码:</td>

<td><input type="password" width=30 class="easyui-textbox"

data-options="required:true,validType:'length[6,6]',missingMessage:'请输入6位数密码'"/></td>

</tr>

<tr>

<td>年龄:</td>

<td><input width=30 class="easyui-numberbox"

data-options="required:false,precision:2,min:18,max:70"/></td>

</tr>

<tr>

<td>工资:</td>

<td><input width=30 class="easyui-numberbox"

data-options="required:false,precision:0,min:0,prefix:'$'"/></td>

</tr>

<tr>

<td>生日:</td>

<td><input width=30 class="easyui-datebox"

data-options="required:true,editable:false"/></td>

</tr>

<tr>

<td>注册时间:</td>

<td><input width=30 class="easyui-datetimebox"

data-options="required:true,editable:false"/></td>

</tr>

<tr>

<td>城市:</td>

<td><select class="easyui-combobox" style="width:100px">

<option value="0">未选择</option>

<option value="1">北京</option>

<option value="2">上海</option>

</select>

</td>

</tr>

<tr>

<td>城市1:</td>

<td><input id="yij" class="easyui-combobox" style="width:100px" data-options="required:false,

valueField:'id',

textField:'name',

url:'JsonMembers?parentid=0',

value:'-1',

onSelect:function(rec){

var url='JsonMembers?parentid='+rec.id;

$('#erj').combobox('clear');

$('#erj').combobox('reload',url);

$('#erj').combobox('setValue','-1');

$('#sanj').combobox('clear');

$('#sanj').combobox('reload','JsonMembers');

$('#sanj').combobox('setValue','-1');

}" />

</td>

</tr>

<tr>

<td>城市2:</td>

<td><input id="erj" class="easyui-combobox" style="width:100px"

data-options="required:false,valueField:'id',textField:'name',url:'JsonMembers',value:'-1',

onSelect:function(rec){

var url='JsonMembers?parentid='+rec.id;

$('#sanj').combobox('clear');

$('#sanj').combobox('reload',url);

$('#sanj').combobox('setValue','-1');

}" />

</td>

</tr>

<tr>

<td>城市3:</td>

<td><input id="sanj" class="easyui-combobox" style="width:100px"

data-options="required:false,valueField:'id',textField:'name',url:'JsonMembers',value:'-1'" />

</td>

</tr>

<tr>

<td colspan=2 align="center">

<a id='subbutton' class="easyui-linkbutton" style="width:40px">提交</a></td>

</tr>

</table>

</form>

</div>

</body>

</html>

EasyUI表单内容整理的更多相关文章

  1. EasyUI表单验证，自定义插件验证，自定义js插件验证，远程验证，常见手机号，中英文，qq等验证规则验证

     { field : 'startPort', title : "起始端口", editor: "text", width : 50, editor: { ...

  2. easyui表单插件-包括日期时控件-列表

    ← jQuery EasyUI 表单插件 – Numberspinner 数值微调器 jQuery EasyUI 表单插件 - Timespinner 时间微调器  jQuery EasyUI 插件 ...

  3. easyui表单提交，后台获取不到值

    J2ee开发,使用easyui表单提交,在ie中可以正常将参数传递到后台,但使用firefox,chrome都无法将easyui的combobox值传递到后台,使用alert($('#form').s ...

  4. c#程序为PDF文件填写表单内容

    众所周知,PDF文件一般情况下是无法修改的,如果你有一张现成的PDF表格,这时想通过编程实现从数据库或者动态生成内容去填写这张表格,就会有些问题了,首先我们要解决以下2个重要的问题: 1.如何将内容写 ...

  5. easyUI表单基础知识

    easyUI创建异步提交表单 我们创建一个带有 name.email 和 phone 字段的表单.通过使用 easyui 表单(form)插件来改变表单(form)为 ajax 表单(form).表单 ...

  6. Django--post提交表单内容

    本节目标:①.提交表单内容②.通过客户端提交表单新增一篇文章③.通过Django的forms组件来完成新增一篇文章 =======提交表单内容======== 1.前端html:login.html ...

  7. JQuery EasyUI 表单

    EasyUI 创建异步提交表单 ♦ 通过使用 easyui 表单插件来改变表单为 ajax表单. 表单提交所有字段到后台服务器,服务器处理和发送一些数据返回到前端页面.我们接收返回数据,并将它显示出来 ...

  8. 雷林鹏分享：jQuery EasyUI 表单 - 创建异步提交表单

    jQuery EasyUI 表单 - 创建异步提交表单 本教程向您展示如何通过 easyui 提交一个表单(Form).我们创建一个带有 name.email 和 phone 字段的表单.通过使用 e ...

  9. 雷林鹏分享：jQuery EasyUI 表单 - 创建树形下拉框

    jQuery EasyUI 表单 - 创建树形下拉框 树形下拉框(ComboTree)是一个带有下列树形结构(Tree)的下拉框(ComboBox).它可以作为一个表单字段进行使用,可以提交给远程服务 ...

随机推荐

  1. Spring MVC中Action使用总结

    Spring MVC中每个控制器中可以定义多个请求处理方法即Action,Action可以有多个不同的参数,有多种类型的返回结果. 可以作为Action的参数类型有: 表单对象基本数据类型,包括包装类 ...

  2. jstl-vaStatus 属性count与index

    一个老生常谈的话题,今天有了新得: <% List list= new ArrayList(); list.add("饼干"); list.add("牛奶" ...

  3. iOS 如何在一个已经存在多个project的workspace中引入cocoapods管理第三方类库

    一种新的第三方库管理工具:Carthage 如何使用Carthage管理iOS依赖库 Podfile Syntax Reference v1.1.0.rc.3 https://guides.cocoa ...

  4. Entity Framework 数据库初始化四种策略

    策略一:数据库不存在时重新创建数据库 Database.SetInitializer<testContext>(new CreateDatabaseIfNotExists<testC ...

  5. Kanzi编程基础1 - 定时器Timer

    Kanzi虽然发生了比较多的版本更迭,api也发生了很多变化,但定时器的头文件一直都在一个地方:#include "user/include/user/ui/message/kzu_mess ...

  6. 携程Ctrip DAL的学习1

    携程Ctrip DAL的学习 1 本人net开发菜鸟,原理请自行看github的官网源码. 我这里是简单的使用(helloworld的水平). Ctrip DAL是携程框架部开发的数据库访问框架,支持 ...

  7. UTF-8 ->GBK

    /** * GBK->UTF8 */ //方法一 旧方法 //NSString *encode1 = [@"%E6%88%91" stringByReplacingPerce ...

  8. Android高级控件--AdapterView与Adapter

    在J2EE中提供过一种非常好的框架--MVC框架,实现原理:数据模型M(Model)存放数据,利用控制器C(Controller)将数据显示在视图V(View)上.在Android中有这样一种高级控件 ...

  9. XMLHttpRequest.status状态码

    XMLHttpRequest.status状态码1xx-信息提示 这些状态代码表示临时的响应.客户端在收到常规响应之前,应准备接收一个或多个1xx响应. 100-继续. 101-切换协议. 2xx-成 ...

  10. (转)javascript 奇淫巧技44招

    1.首次为变量赋值时务必使用var关键字 变量没有声明而直接赋值得话,默认会作为一个新的全局变量,要尽量避免使用全局变量. 2.使用===取代== ==和!=操作符会在需要的情况下自动转换数据类型.但 ...