|
|
1.beginFormPanel.js(作用:外层html文件中表单的展现)
<script>
var beginFormPanel = Ext.extend(Ext.form.FormPanel,{
constructor:function()
{
beginFormPanel.superclass.constructor.call
(
this,
{
title:"myForm(绝不裸奔)",
width:418,
height:180,
frame:true,
labelWidth:45,
style:"margin-left:250px",
defaultType:"textfield",
defaults:{anchor:"95%"},
items:
[
{
fieldLabel:"姓名",
name:"name"
},
{
fieldLabel:"年龄",
name:"age"
},
{
fieldLabel:"性别",
name:"sex"
},
{
fieldLabel:"住址",
name:"addr"
}
],
buttons:
[
{
text:"添加"
},
{
text:"修改"
},
{
text:"删除"
}
],
renderTo:Ext.getBody()
}
) ;
}
}) ;
</script>
2.beginPanel.js(作用:GridPanel与窗口以及窗口中FormPanel的实现)
<script>
/**************************** FormPanel *****************************************************/
var myWindowForm = Ext.extend(Ext.form.FormPanel,{
constructor:function()
{
myWindowForm.superclass.constructor.call
(
this,
{
labelWidth:45,
defaultType:"textfield",
defaults:{anchor:"93%"},
style:"padding:5px",
baseCls:"x-plain",
items:
[
{
fieldLabel:"姓名",
name:"name",
allowBlank:false,
blankText:"姓名不能够为空!"
},
{
fieldLabel:"年龄",
name:"age",
allowBlank:false,
vtype:"age",
blankText:"年龄不能够为空!"
},
{
fieldLabel:"性别",
name:"sex",
allowBlank:false,
blankText:"性别不能够为空!"
},
{
fieldLabel:"住址",
name:"addr",
allowBlank:false,
blankText:"住址不能够为空!"
}
]
}
) ;
},
getValues:function()
{
if(this.getForm().isValid())
{
return new Ext.data.Record(this.getForm().getValues()) ;
}
else
{
throw error("表单验证没通过哦!") ;
}
},
setValues:function(record)
{
this.getForm().loadRecord(record) ;
},
reset:function()
{
this.getForm().reset() ;
}
}) ;
/******************************** Window ***********************************/
var myWindow = Ext.extend(Ext.Window,{
form:new myWindowForm(),
constructor:function()
{
myWindow.superclass.constructor.call
(
this,
{
title:"myWindow(绝不裸奔)",
width:300,
height:185,
frame:true,
plain:true,
modal:true,
items:this.form,
closable:false,//禁止关闭
collapsible:true,//可折叠
buttons:
[
{
text:"确定",
handler:this.onSubmitClick,
scope:this
},
{
text:"取消",
handler:this.onCancelClick,
scope:this
}
]
}
) ;
this.addEvents("submit") ;
},
close:function()
{
this.hide() ;
},
onSubmitClick:function()
{
/*
try
{
this.fireEvent("submit",this,this.form.getValues()) ;
}
catch (error)
{
Ext.Msg.alert("警告","请将需要填写的信息填写完整!") ;
}
*/
this.fireEvent("submit",this,this.form.getValues()) ;
this.close() ;
},
onCancelClick:function()
{
//上面不加scope属性则提示this.form为空
this.form.reset() ;
this.close() ;
}
}) ;
JavaScript技术：JS小练习代码之二第1/2页，转载需保留来源！
郑重声明：本文版权归原作者所有，转载文章仅为传播更多信息之目的，如作者信息标记有误，请第一时间联系我们修改或删除，多谢。
