<%@ 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. SQL查询每个表的字段数量

    --SQL查询每个表的字段数量select b.[name], count(*) As AllCount,ISNULL(ISNULL(sum(case when isnullable=0 then 1 ...

  2. XML创建与解析常用方法介绍

    XML解析方式介绍 1.DOM4J(Document Object Model for Java)      虽然DOM4J代表了完全独立的开发结果,但最初,它是JDOM的一种智能分支.它合并了许多超 ...

  3. 要慎用mysql的enum字段的原因

    背景:时下都流行enum类型的使用tinyint,那enum就真没有用的价值了么? PHP低级编程的兄弟是这样来看这个问题的,我作下笔录如下,期望能客观的理解这个enum字段的优点及缺点: 膘哥观点: ...

  4. eclipse gradle插件(buildship)的安装和使用

    一.下载gradle https://gradle.org/gradle-download/ 二.手动安装gradle插件 我选择的是buildship,经过实际使用,体验很好. 插件的下载地址是: ...

  5. js类型检测

    1.typeof  或者  typeof() 适合基本类型及function检测,遇null失效 ex: typeof 100      返回值为 "number" typeof ...

  6. 谈谈Memcached与Redis

    1. Memcached简介 Memcached是以LiveJurnal旗下Danga Interactive公司的Bard Fitzpatric为首开发的高性能分布式内存缓存服务器.其本质上就是一个 ...

  7. 【转】部分电脑安装升级 ubuntu 12.04 后无法挂起问题的解决(挂起无法唤醒同样有效)

    原文地址:http://blog.csdn.net/longerzone/article/details/7860232 我的Ubuntu12.04是安装的windows桌面安装版(使用wubi安装) ...

  8. html中css、div命名规范

    html中css.div命名规范 1.类class的命名规范示例 头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar 栏目:column ...

  9. SQL基础--序列

    序列是一种数据库对象,用来自动产生一组唯一的序号:序列是一种共享式的对象,多个用户可以共同使用序列中的序号. 序列的创建语法 CREATE SEQUENCE sequencename [INCREME ...

  10. centos 开机启动服务

    一.启动脚本 /etc/rc.local 启动 最简单的一种方式,在启动脚本 /etc/rc.local (其实 /etc/rc.local 是/etc/rc.d/rc.local 的软链接文件,实际 ...