JS小練習(xí)代碼之二
更新時(shí)間:2008年10月12日 23:25:25 作者:
JS練習(xí)代碼
/************************** GridPanel **************************************/
var beginMyPanel = Ext.extend(Ext.grid.GridPanel,{
insertWin:new myWindow(),
constructor:function()
{
//this.insertWin = new myWindow() ;
var myData =
[
["th","91","非女","地球"],
["thtwin","92","男","地球"],
["thtwinj2ee","93","非女","地球"],
["thj2ee","94","男","地球"],
["thtwin","95","非女","地球"]
] ;
var myRecord = Ext.data.Record.create
(
["name","age","sex","addr"]
) ;
var myColumn = new Ext.grid.ColumnModel
(
[
{header:"姓名",dataIndex:"name"},
{header:"年齡",dataIndex:"age"},
{header:"性別",dataIndex:"sex"},
{header:"住址",dataIndex:"addr"}
]
) ;
var myStore = new Ext.data.Store
(
{
proxy:new Ext.data.MemoryProxy(myData),
reader:new Ext.data.ArrayReader
(
{},
myRecord
)
}
) ;
beginMyPanel.superclass.constructor.call
(
this,
{
title:"myGridPanel(thtwinj2ee)",
frame:true,
width:418,
height:250,
cm:myColumn,
ds:myStore,
style:"margin:20,0,10,250",
tbar:
[
{
text:"添加人員",
handler:function()
{
this.insertWin.show() ;
},
scope:this
},
"-",//得到的結(jié)果為:|
{text:"修改人員"},
"-",
{text:"刪除人員"}
],
selModel:new Ext.grid.RowSelectionModel
(
{
listeners:
{
"rowselect":
{
fn:function(row,index,record)
{
this.setTitle("修改之后的GridPanel的名字!") ;
//注意下面的這句 ***** 1 ******
this.fireEvent("rowselect",record) ;
},
scope:this
}
}
}
),
renderTo:Ext.getBody()
}
) ;
myStore.load() ;
//注意下面這句 ***** 2 ******
this.addEvents("rowselect") ;
this.insertWin.on("submit",this.onInsertWinSubmit,this) ;
},
insert:function(myRecord)
{
this.getStore().add(myRecord) ;
},
onInsertWinSubmit:function(insertWin,myRecord)
{
this.insert(myRecord) ;
}
}) ;
</script>
3.靜態(tài)html頁(yè)面的表現(xiàn)
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="../AllRes/resources/css/ext-all.css"/>
<script type="text/javascript" src="../AllRes/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../AllRes/ext-all.js"></script>
<script type="text/javascript" src="beginPanel.js"></script>
<script type="text/javascript" src="beginFormPanel.js"></script>
<script>
Ext.onReady(function(){
Ext.QuickTips.init() ;
Ext.form.Field.prototype.msgTarget="side" ;
Ext.apply(Ext.form.VTypes,{
"age":function(value)
{
//此處用正則表達(dá)式要使
if(/^\d+$/.test(value))
{
return true ;
}
return false ;
},
"ageText":"請(qǐng)輸入正確的年齡!"
}
) ;
/* var newnewMyWindowForm = new myWindowForm() ;
newMyWindowForm.render(Ext.getBody()) ;
*/
// var newnewMyWindow = new myWindow() ;
// newMyWindow.show() ;
var myGridPanel = new beginMyPanel() ;
var myForm = new beginFormPanel() ;
//注意下面這句與***** 1 ****** 和 ***** 2 ******的關(guān)系
myGridPanel.on
(
"rowselect",
function(selectedRow)
{
this.getForm().loadRecord(selectedRow) ;
},
myForm
) ;
}) ;
</script>
</head>
<body>
</body>
</html>
相關(guān)文章
ko knockoutjs動(dòng)態(tài)屬性綁定技巧應(yīng)用
ko的動(dòng)態(tài)屬性是指,ViewModel不確定的屬性,而后期卻需要的屬性,本文將詳細(xì)介紹,需要的朋友參考下2012-11-11javascript數(shù)字驗(yàn)證的實(shí)例代碼(推薦)
下面小編就為大家?guī)?lái)一篇javascript數(shù)字驗(yàn)證的實(shí)例代碼(推薦)。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-08-08在一個(gè)頁(yè)面重復(fù)使用一個(gè)js函數(shù)的方法詳解
下面小編就為大家?guī)?lái)一篇在一個(gè)頁(yè)面重復(fù)使用一個(gè)js函數(shù)的方法詳解。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧,祝大家游戲愉快哦2016-12-12webpack項(xiàng)目輕松混用css module的方法
這篇文章主要介紹了webpack項(xiàng)目輕松混用css module的方法,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-06-06基于JavaScript實(shí)現(xiàn)全選、不選和反選效果
這篇文章主要為大家詳細(xì)介紹了基于JavaScript實(shí)現(xiàn)全選、不選和反選效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-02-02jquery+css3實(shí)現(xiàn)網(wǎng)頁(yè)背景花瓣隨機(jī)飄落特效
在qq空間可以自定義一些插件,裝飾空間,大家通常就是復(fù)制代碼到空間粘貼,會(huì)實(shí)現(xiàn)非常美觀的效果,有的會(huì)隨機(jī)飄落一些花瓣,那么這種效果用代碼怎么實(shí)現(xiàn)的呢,下面小編給大家詳解jquery實(shí)現(xiàn)網(wǎng)頁(yè)背景花瓣隨機(jī)飄落特效,需要的朋友可以參考下2015-08-08