java隨記

          堅持就是勝利!

           

          不太累的ext:FormPanel

          慢慢開始接觸Ext,防公司讓我搞這個,先做點準備,準備多少是多少.在網上搜了很多例子,無一例外的都是在items[]數組里去定義一些新的對象,就象下面代碼的上部分一樣,難以閱讀,看著那叫一個累,尤其是初學者,都不知道items里到底是什么對象,照著敲這些代碼還容易出錯,查了查ext文檔,發現組件類都有add方法,于是改了一個別人的例子,覺著好理解多了,并且便于調試多了.就在下面代碼的后一部分,相信這種寫法應該是搞面象對象編程人員比較喜歡的一種方式

          <html>  
          <head>  
           <link rel="stylesheet" type="text/css" href="ext-2.2.1/resources/css/ext-all.css" />
            <script type="text/javascript" src="ext-base.js"></script>
            <!-- ENDLIBS -->

              <script type="text/javascript" src="ext-all-debug.js"></script> 
            <script>     
           
           Ext.onReady(function(){

              Ext.QuickTips.init();

              // turn on validation errors beside the field globally
              Ext.form.Field.prototype.msgTarget = 'side';
           //定義一個FormPanel
              var fsf = new Ext.form.FormPanel({    
                title:"FormPanel2 ",
                url:'',
                frame:true,
                width:350,     
                bodyStyle:'padding:5px 5px 0',
                //height:120,
                //defaultType:'textfield',
                items:[
                //定義兩個FieldSet
                  {
                 xtype:'fieldset',
                 checkboxToggle:true,
                 title:'User Information',
                 autoHeight:true,
                 defaultType:'textfield',
                 //defaults: {width: 210},
                 collapsed:true,
                 items :[
                   {fieldLabel: 'First Name',name: 'first', allowBlank:false},
                {fieldLabel: 'Last Name',name: 'last'},
                {fieldLabel: 'Company',name: 'company'},
                {fieldLabel: 'Email',name: 'email', vtype:'email'}
                               ]
               },
               {
                             xtype:'fieldset',
                             title: 'Phone Number',
                             collapsible: true,
                             autoHeight:true,
                             //defaults: {width: 210},
                             defaultType: 'textfield',
                             items :[
                   {fieldLabel: 'Home',name: 'home',value: '(888) 555-1212'},
                {fieldLabel: 'Business',name: 'business'},
                {fieldLabel: 'Mobile',name: 'mobile'},
                {fieldLabel: 'Fax',name: 'fax'}
                               ]
                            }
               
                ]
             
             });
            //new一個FieldSet
            var fieldset = new Ext.form.FieldSet({
               title: 'Phone Number',
                             collapsible: true,
                             autoHeight:true,
                             //defaults: {width: 210},
                             defaultType: 'textfield'
                            
            });
            //new一個TextFiled,
            var textFiled1 = new Ext.form.TextField();
            textFiled1.fieldLabel="Home2";
            textFiled1.name="home";
                  textFiled1.value="(888) 555-1212";
            //textFiled添加到FieldSet
                  fieldset.add(textFiled1);
                  //Fieldset添加到FormPanel  
                  fsf.add(fieldset);
                  fsf.render(document.body);
          });
            </script>  
            </head>
            <body>

          </body>  
          </html>  

          雖然這樣看起來js代碼不太簡潔,但比較好維護,不太容易出錯 




           

          posted on 2009-08-19 13:57 傻 瓜 閱讀(2966) 評論(2)  編輯  收藏 所屬分類: javascript

          評論

          # re: 不太累的ext:FormPanel[未登錄] 2009-08-20 08:36 michael

          其實直接在items里面列出對象使得對象的層次更清晰。
          像你下面那樣如果fieldset里面還有對象,對象里面還有對象....那么如果用你說的那種結構層次結構就整個亂了  回復  更多評論   

          # re: 不太累的ext:FormPanel 2009-08-25 08:48 找個美女做老婆

          Java樂園學習網站: http://www.javaly.cn

          有大量的學習文章和視頻教程,以及一些項目源碼

          Java樂園學習群: 81107233  回復  更多評論   

          導航

          統計

          常用鏈接

          留言簿(7)

          我參與的團隊

          隨筆分類

          隨筆檔案

          文章分類

          友情鏈接

          搜索

          積分與排名

          最新評論

          閱讀排行榜

          評論排行榜

          主站蜘蛛池模板: 田阳县| 内乡县| 新竹县| 武清区| 陈巴尔虎旗| 苗栗市| 涟水县| 美姑县| 博乐市| 徐水县| 万全县| 瓦房店市| 南通市| 龙口市| 平原县| 灯塔市| 舟山市| 洪泽县| 红河县| 宜城市| 东海县| 都江堰市| 余干县| 巴林右旗| 琼中| 青浦区| 楚雄市| 承德市| 古丈县| 南木林县| 桦南县| 资兴市| 仁怀市| 平陆县| 栖霞市| 建德市| 南乐县| 郑州市| 绥宁县| 沭阳县| 武邑县|