我的漫漫程序之旅

专注于JavaWeb开发

ExtJs 之简单 Form提交

<%@ page language="java" pageEncoding="gbk"%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>
<html>
    <head>
        <link rel="stylesheet" type="text/css"
            href="<%=basePath%>/js/ext/resources/css/ext-all.css" />
        <script type="text/javascript"
            src="<%=basePath%>/js/ext/adapter/ext/ext-base.js"></script>
        <script type="text/javascript" src="<%=basePath%>/js/ext/ext-all.js"></script>
        <script type="text/javascript">
  Ext.onReady(function()
  {
       var form1 = new Ext.form.FormPanel({
       renderTo:"loginForm", //要渲染的div
       labelWidth: 75, // label settings here cascade unless overridden 
       method:'POST',
       title: '登录窗口',
       bodyStyle:'padding:5px 5px 0',
       width: 300,
       defaults: {width: 200},
       defaultType: 'textfield',
       //实现非AJAX提交表单一定要加下面的两行！
       onSubmit: Ext.emptyFn,
       submit: function() 
       {
           this.getEl().dom.action= 'index.jsp'; //连接到服务器的url地址
           this.getEl().dom.submit();
       },
       
       items: [{
           fieldLabel: '用户名',
           id: 'username', 
           name: 'name',   
           allowBlank:false,
           blankText : "用户名不能为空",
           width:150
           },{
           fieldLabel: '密码',
           blankText : "密码不能为空",
           id: 'password',
           name: 'pwd',
           allowBlank:false,
           minLength : 6,
           width:150,
           inputType:'password' //类型为password
       }
       ],
       buttons: [{
           text: '登录',
           type:'button',
           id:'login',
           handler: function()
           {
                   //表单验证通过
                   if (form1.form.isValid())
                   {    
                       //提交form
                       form1.form.submit();
                   }    
           }
       },{
           text: '重置',
           type:'reset',
           id:'clear',
           handler: function()
           {
                form1.form.reset();
           }
       }
       ]
       }); 
    
    //将form添加window中
    var window = new Ext.Window({
        title: '用户登录',
        width: 300,
        height:180,
        layout: 'fit',
        plain:true,
        bodyStyle:'padding:5px;',
        buttonAlign:'center',
        items: form1
    });
    //显示window
    window.show();    
  });
  
 </script>
    </head>
    <body>
        <div id="loginForm"></div>
    </body>
</html>

posted on 2008-07-28 13:21 々上善若水々 阅读(486) 评论(0)  编辑  收藏 所属分类: JavaScript


标题  
姓名  
主页
验证码 *  
内容(请不要发表任何与政治相关的内容)  
  登录  使用高级评论  新用户注册  返回页首  恢复上次提交      
 
 

相关链接:
网站导航:

导航

<2008年12月>
日一二三四五六
30123456
78910111213
14151617181920
21222324252627
28293031123
45678910

统计

留言簿(12)

随笔档案(24)

文章分类(277)

文章档案(228)

搜索

最新评论

阅读排行榜

评论排行榜