20151226--easyUI

<%@ 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>Insert title here</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/easyloader.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" class="easyui-panel" title="用户信息" style="width:300px;height:500px">

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

<table>
<tr>
<td>用户名称</td>
<td><input class="easyui-textbox" data-options=
"required:true,validType:'length[2,5]',invalidMessage:'名称错误'" width="30"></td>

</tr>

<tr>
<td>密码</td>
<td><input class="easyui-textbox" data-options=
"required:true,validType:'length[6,6]',type:'password',invalidMessage:'密码长度为6'" width="30"></td>
</tr>

<tr>
<td>年龄</td>
<td><input class="easyui-numberbox" data-options=
"required:true,precision:0,min:18,max:60" width="30"></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=
"valueField:'id',textField:'name',url:'JsonMembers?parentid=0',editable:false,value:'-1',
onSelect:function(rec){
    var url = 'JsonMembers?parentid='+rec.id;
    
    $('#erj').combobox('clear');
    $('#erj').combobox('reload',url);
    $('#erj').combobox('setValue','-1');
}">
</td>
</tr>

<tr>
<td>城市2:</td>
<td><input id="erj" class="easyui-combobox" style="width:100px" data-options=
"valueField:'id',textField:'name',editable:false,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=
"valueField:'id',textField:'name',editable:false,url:'JsonMembers',value:'-1'">
</td>
</tr>

<tr>
<td>生日</td>
<td><input class="easyui-datebox" data-options="required:true,editable:false" width="30"></td>
</tr>

<tr>
<td>工资</td>
<td><input class="easyui-numberbox" data-options=
"required:true,precision:2,min:0,max:6000,prefix:'$'" width="30"></td>
</tr>

<tr>
<td>用户邮箱</td>
<td><input class="easyui-textbox" data-options=
"required:true,validType:'email',missingMessage:'这是必填项'" width="30"></td>
</tr>

<tr>
<td>个人主页</td>
<!--另外一种框体         <input class="easyui-validatebox" data-options= -->
<td><input class="easyui-textbox" data-options=
"required:false,validType:'url',inonCls:'icon-search',prompt:'提示信息'" width="30"></td>
</tr>


<tr>
<td>注册时间</td>
<td><input class="easyui-datetimebox" data-options="required:true,editable:false" width="30"></td>
</tr>


<tr>
<td colspan=2 align="center">
<a id="subbutton" class="easyui-linkbutton" style="width:80px;">提交</a>
</td>
</tr>
</table>
</form>
</div>
</body>
</html>

 

posted @ 2015-12-27 21:41  業&裳  阅读(159)  评论(0编辑  收藏  举报