EXTJS入門の例

3323 ワード

最近プロジェクトをしてEXTJSを使うことを始めて、以前EXTJSに接触したことがなくて、しかし私は堅持する学習と蓄積を経て、すぐに上手になることができると信じて、特に私はいくつかの学習のDEMOを記録して、学ぶことができないことを恐れないでください、自分の練習の少なさを恐れて、1つの技術が熟練してやっと器用になることができて、多く練習するのはきっとできて、くだらない話は多く言わないで、記録を始めて、
事前準備:
Extをインポートするために必要なスタイルシートとクラスライブラリ:
<link   href="extjs/resources/css/ext-all.css"      rel="stylesheet" type="text/css"/>

<script src ="extjs/ext-all.js"                     type="text/javascript"></script>

<script src ="extjs/ext.base.js"                 type="text/javascript"></script>

<script src ="extjs/locale/ext-lang-zh_CN.js"     type="text/javascript"></script>

EXTのコードは以下のスクリプトに書かれています.
<script type="text/javascript">

    Ext.onReady(function(){







    });

</script>

 
今から例を书いて、実は例はすべてネット上のので、しかしどうでもいい、自分のものに転化するのは自分のので、ただ他の人は私达より先に学んだだけです
  Ext.MessageBox.alert(「監査プロンプト」、「監査通過!」);
 
var win=Ext.create(「Ext.window.Window」,{title:'サンプルウィンドウ',width:600,height:400});win.show();
 
var panel=new Ext.Panel({title:"例",renderTo:'sub 1',width:'300 px',html:"
私のidはsub 3
");
 
//        

 Ext.QuickTips.init();

//      

 Ext.Loader.setConfig({

     enabled: true

});
                Ext.create('Ext.panel.Panel', {

                      width:750,

                    layout: 'fit',

                    renderTo:'form-itdatum-checkbox',

                    items: {

                        xtype: 'userlist',

                        id:'testGrid2',

                        title: '    -<span style="color:red;">         </span>',

                        selModel: new Ext.selection.CheckboxModel({checkOnly:true})

                    }

                });


var testGrid1=Ext.getCmp('testGrid1'); var records=testGrid1.getSelectionModel().getSelection(); if(records.length==0){Ext.MessageBox.alert('ヒント','レコードを選択してください');else { alert(Itdatum.net.grid.encodeRecords(records)); }



 
  
 
 
リソースアドレス:http://www.zui dai ma.com/share/kextjs-p1-s1.htm