Ⅰ Extjs動態載入樹,增刪查該,自動刷新
不需要用ajax
是增加的一個樹節點,n表示被選中的樹節點
單點一個增加按鈕,彈出一個窗體中含有一個需要添加節點的信息的formpanel
添加信息好提交
需要注意的是創建treepanel的時候有一個屬性是指定其自動載入指定的url
具體是哪個屬性忘了,
closable : true,
useArrows : true,
autoScroll : true,
animate : true,
//enableDD : true,
containerScroll : true,
border : false,
// auto create TreeLoader
dataUrl : 'org!treeList?org.id=1',
下面是增加樹節點的提交
Ext.getCmp('orgAddFormPanel').getForm().submit({ url : 'org!add', waitMsg : 載入中...', success : function(form, action) { orgAddWindow.close(); if(n.leaf) { n.leaf = false; } n.expand(false, true); n.appendChild(action.result.org); } });
Ⅱ Extjs中的combobox的動態載入問題
大概過程是定義store裡面存放你需要的東西,然後把store放在combobox裡面.
給你個例子,希望能夠幫到你.
//定義的store
var examStore = new Ext.data.Store({
model: 'Exam',
pageSize: 10, // items per page
proxy: new Ext.data.HttpProxy({
url: 'ExamHandler.ashx?method=getAll',
reader: {
type: 'json',
root: 'data',
totalProperty: 'total'
}
}),
listeners:{
load:function(){
var combo = form.getForm().findField("examId");
combo.setValue(combo.getValue());
}
}
});
examStore.load();
//combox 在form裡面的寫法
{
fieldLabel: '選擇試卷',
xtype: 'combo',
msgTarget: 'side',
editable: false,
triggerAction: 'all',
lazyRender: true,
mode: 'local',
store: examStore,
valueField: 'id',
displayField: 'examName',
name: 'examId'
},
Ⅲ ExtJS 動態增加與刪除items,動態設置textField可見與否
Ext.getCmp('textFieldId').setVisible(false);
Ext.getCmp('textFieldId').getEl().up('.x-form-item').setDisplayed(false);
/**
*動態設置fieldLabel的值與
*動態設置是否可見
*/
if (bFlag){
mNextDate.el.parent().parent().parent().first().dom.innerHTML = '下次年審日期';
mReviewDate.el.parent().parent().parent().first().dom.innerHTML = '年審日期';
mReviewProject.setVisible(true);
mReviewProject.getEl().up('.x-form-item').setDisplayed(true);
mReviewContent.setVisible(true);
mReviewContent.getEl().up('.x-form-item').setDisplayed(true);
mReviewState.setVisible(false);
mReviewState.getEl().up('.x-form-item').setDisplayed(false);
}else{
mNextDate.el.parent().parent().parent().first().dom.innerHTML = '結束時間';
mReviewDate.el.parent().parent().parent().first().dom.innerHTML = '起始時間';
mReviewProject.setVisible(false);
mReviewProject.getEl().up('.x-form-item').setDisplayed(false);
mReviewContent.setVisible(false);
mReviewContent.getEl().up('.x-form-item').setDisplayed(false);
mReviewState.setVisible(true);
mReviewState.getEl().up('.x-form-item').setDisplayed(true);
}
Ⅳ extjs 動態添加控制項怎麼刪除
extjs刪除動態添加的控制項的方法是利用remove函數。
函數原型定義:remove( Component/String component, [Boolean autoDestroy]) : Void
作用:從指定的回容器中移除組件答。刪除之前觸發事件beforeremove,則觸發該組件已被刪除後remove事件。
參數說明:
component : 將被刪除的組件/字元串組件引用或者id。
autoDestroy : 布爾(可選)True可以自動調用刪除組件的Ext.Component.destroy功能。默認為這個容器的autoDestroy配置值
Ⅳ Extjs CheckboxGroup動態添加checkBox
我建議你用Ext.form.FieldSet
如果非要用CheckboxGroup的話
最簡單的方法是重新new一個,因為他沒有add方法
動態添加沒研究過..
Ⅵ Extjs如何動態載入Extjs腳本
1、首先,需要先創建一個基本可用的 ExtJS 模板, 這個很簡單, 如下所示:
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="http://localhost/ext-4/resources/css/ext-all.css" />
<script type="text/javascript" src="http://localhost/ext-4/ext-debug.js"></script>
</head>
<body>
</body>
</html>
2、需要引用的腳本是 ExtJS 根目錄下的 ext-debug.js , 不是 ext-all-debug.js, 這個文件非常小, 只有幾百K , 當讓這個只是最基本的 ExtJS 組件, 不包括任何的界面功能。
3、配置 Ext.Loader 啟用動態載入;
4、ExtJS 中的動態載入是由 Ext.Loader 來完成的, 默認不啟用動態載入, 所以接下來需要做的事配置 Ext.Loader 啟用動態載入, 在上面模板的 body 標簽內添加如下代碼:
<script type="text/javascript">
Ext.onReady(function() {
Ext.Loader.setConfig({
enabled : true,
disableCaching: false,
paths : {
Ext : '/ext-4/src'
}
});
});
</script>
注意:上面的代碼啟用了動態載入, 禁用了瀏覽器緩存, 以及指定了 ExtJS 的所部署的路徑。
Ⅶ extjs復選框怎麼動態取值和賦值
var sm0 = new Ext.grid.CheckboxSelectionModel();
sm0.handleMouseDown = Ext.emptyFn;//主要是這句
Ⅷ 動態設置extjs文本框的事件
<!doctypehtml>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title>Extjs4.2demo</title>
<linkrel="stylesheet"href="../resources/css/ext-all.css">
<scriptsrc="../bootstrap.js"></script>
<script>
.onReady(function(){
Ext.create('Ext.form.FormPanel',{
width:250,
bodyPadding:'550',
fieldDefaults:{
labelWidth:75
},
items:[{
xtype:'fieldset',
title:'information',
defaultType:'textfield',
layout:'anchor',
defaults:{
anchor:'100%'
},
items:[{
fieldLabel:'First',
name:'first',
listeners:{
change:function(field,nv,ov,opts){
varlastfield=this.getBubbleParent().items.last();
lastfield.$ml&&lastfield.un('focus',lastfield.$ml);
lastfield.$ml=function(){
Ext.Msg.alert('結果',Ext.String.format('第一個欄位的值為:"{0}",最後一個欄位的值為:"{1}"',nv,this.value));
};
//設置最後一個textfield的listeners
lastfield.on('change',lastfield.$ml,lastfield);
}
}
},{
fieldLabel:'Second',
name:'second'
},{
fieldLabel:'Last',
name:'last'
}]
}],
renderTo:Ext.getBody()
});
});
</script>
</head>
<body>
</body>
</html>