我的漫漫程序之旅

          專注于JavaWeb開發
          隨筆 - 39, 文章 - 310, 評論 - 411, 引用 - 0
          數據加載中……

          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 々上善若水々 閱讀(6746) 評論(0)  編輯  收藏 所屬分類: JavaScript

          主站蜘蛛池模板: 隆化县| 紫阳县| 鄄城县| 潜江市| 武宣县| 泗洪县| 德令哈市| 江都市| 孝昌县| 聂拉木县| 交口县| 云霄县| 弋阳县| 长沙市| 铜鼓县| 灵山县| 洛阳市| 吉水县| 闵行区| 舟山市| 苗栗县| 巴楚县| 城固县| 威海市| 中阳县| 永兴县| 额尔古纳市| 佳木斯市| 健康| 常熟市| 田东县| 唐山市| 新干县| 正安县| 成安县| 鄂尔多斯市| 常宁市| 宁南县| 南丹县| 长寿区| 巴青县|