extjslocalfilter

『壹』 用extjs技術怎麼在行中嵌入下拉列表框

首先grid的是new Ext.grid.EditorGridPanel可編輯的列表。這里可以配置參數單擊或雙擊編輯所在行，具體的見api。
然後是這里new Ext.grid.ColumnModel([
需要嵌入下拉列表框的列這樣定義就哦了
{header : "合同狀態",width : 100,sortable : true,align : "center",dataIndex : "state"
,editor : new Ext.form.ComboBox({//編輯的時候變成下拉框。
triggerAction : "all",
width : 120,
editable: false,
store : ["建立","執行","作廢","完結"],
resizable : true,
mode : 'local',
lazyRender : true
})
}

『貳』 extjs combo 過濾問題

因為第一次點擊的時候 , 這個store可能才開始載入 , 預先載入store試試 , 或者 store 中 autoLoad = true 試試

『叄』 怎麼查看extjs filter的過濾

主要利用filter過濾掉未經登錄而直接跳轉到非登錄訪問頁面。代碼而言的話並不難，只是有幾點問題需要注意一下。
1.使用filter需要配置web.xml，如果是/*那麼在攔截後的頁面會連帶jsp頁面里的js和css一並攔截住。
解決辦法是jsp放在jsppage這個文件下，其他css、js並列。配置的時候就/jsppage/*。
還有個辦法是在dofilter裡面判斷在request域拿到url，進行比對，然後過濾。
2.需要設置哪些頁面是你不想攔截的【假設所有的頁面都放在jsppage內】。
代碼見下：
LoginFilert.java
public class LoginFilter extends HttpServlet implements Filter {
public void doFilter(ServletRequest sRequest, ServletResponse sResponse,
FilterChain filterChain) throws IOException, ServletException {
HttpServletRequest request = (HttpServletRequest) sRequest;
HttpServletResponse response = (HttpServletResponse) sResponse;
HttpSession session = request.getSession();
String url = request.getServletPath();
String contextPath = request.getContextPath();
if (url.equals("")){
url += "/";
}
if ((url.startsWith("/") && !url.startsWith("/jspPage/login"))) {// 若訪問後台資源
// 設置不需要過濾的頁面
if (url.endsWith("about.jsp")) {
filterChain.doFilter(sRequest, sResponse);
return;
}
// 過濾到login
String admin = (String) session.getAttribute("admin_name");
if (admin == null) {// 轉入管理員登陸頁面
response.sendRedirect(contextPath + "/jspPage/login.jsp");
return;
}
}
filterChain.doFilter(sRequest, sResponse);
}
public void init(FilterConfig arg0) throws ServletException {
// TODO Auto-generated method stub
}
}
web.xml

loginFilter

util.LoginFilter

loginFilter
/jspPage/*

『肆』 extjs4.1版本 treePanel樹形表格列表增加鎖定功能(lock)和查詢過濾(filter)

剛查的api 有這個參數enableLocking
如果不能全量升級版本的話，可以考慮一下能不能單獨升級這部分的代碼，重寫源碼

『伍』 extjs中下拉框的內容實現有條件選擇，對應的情況下可以選擇一些對應的選項

參考代碼如下：
{ header: '單位名稱', dataIndex: 'unitname',
field:
{ xtype: 'combo',
editable: false,
emptyText: "請選擇...",
valueField: "id",
displayField: "text",
mode: 'local',
store: storeddl
}
}

var storeddl = Ext.create('Ext.data.Store', {
proxy: {
type: 'ajax',
url: "../../Handler/SystemHandler/UnitHandler.ashx?Lx=ddl"
},
root: 'items',
forceSelection: true,
// lazyRender: true,
fields: ['id', 'text'],
listeners:

{

select: selectRow,

focus: eventFocus

}
});

『陸』 ExtJS grid表頭如何增加下拉項

extjs自己提供復選框列

//checkbox列

varfilecheckbox=newExt.grid.CheckboxSelectionModel();

//GridPanel

varfileGrid=newExt.grid.GridPanel({

store:fileStore,

columns:[

newExt.grid.RowNumberer(),//顯示列數

filecheckbox,//顯示復選框列

{//其他顯示列}]

//省略其他屬性

});

這樣你就可以而得到一個復選框，可以進行單選、全選了

如果你想自己定義的話，也可以

//定義filters

varfilters=newExt.ux.grid.GridFilters({

//

encode:encode,//jsonencodethefilterquery

local:local,//defaultstofalse(remotefiltering)

filters:[{

type:'numeric',

dataIndex:'id'

},{

type:'string',

dataIndex:'company',

disabled:true

},{

type:'numeric',

dataIndex:'price'

},{

type:'date',

dataIndex:'date'

},{

type:'list',

dataIndex:'size',

options:['small','medium','large','extralarge'],

phpMode:true

},{

type:'boolean',

dataIndex:'visible'

}]

});

//

//

//thefiltertypes(

varcreateColModel=function(finish,start){

varcolumns=[{

dataIndex:'id',

header:'Id',

//=true

//tousestore'sfield'stypeproperty(iftypepropertynot

//'auto'which

//GridFilterswillassumetobe'StringFilter'

filterable:true

//,filter:{type:'numeric'}

},{

dataIndex:'company',

header:'Company',

id:'company',

filter:{

type:'string'

//

//,disabled:true

}

},{

dataIndex:'price',

header:'Price',

filter:{

//type:'numeric'//

}

},{

dataIndex:'size',

header:'Size',

filter:{

type:'list',

options:['small','medium','large','extralarge']

//,phpMode:true

}

},{

dataIndex:'date',

header:'Date',

renderer:Ext.util.Format.dateRenderer('m/d/Y'),

filter:{

//type:'date'//

}

},{

dataIndex:'visible',

header:'Visible',

filter:{

//type:'boolean'//

}

}];

returnnewExt.grid.ColumnModel({

columns:columns.slice(start||0,finish),

defaults:{

sortable:true

}

});

};

然後

vargrid=newExt.grid.GridPanel({

colModel:createColModel(4),

plugins:[filters],

//這兩個屬性是重點，加上去就可以了

});

效果看圖片。

建議你去下載官方的源代碼，然後看其中的例子。

裡面有一個就是如何自定義這個的

『柒』 使用ExtJs生成一個下拉單選框，但是這個單選框在IE瀏覽器顯示正常，在谷歌和火狐瀏覽器顯示不正常，如圖

尊敬的用戶，您好！很高興為您答疑。
從界面上來看，您的list數據沒有被正確識別，建議您打開您的web控制台看下報錯信息，依照您提供的內容來看，這個屬於轉換錯誤。
希望我的回答對您有所幫助，如有疑問，歡迎繼續咨詢我們。

『捌』 Extjs項目中接收json數據點擊某個下拉框實現回顯數據

使用回調函數對 年假欄位賦值.

varholidayType=newExt.form.ComboBox({
store:newExt.data.SimpleStore({	fields:['value','text'],
data:[['0','事假'],['1','病假'],['2','年假']]	}),
fieldLabel:'性別',
displayField:'text',
valueField:'value',
triggerAction:'all',
allowBlank:false,
	width:86,
editable:false,
mode:'local',
listeners:{
select:function(){
varcomb=this;
if(this.getValue()=="年假"){
Ext.Ajax.request({
		url:url,
		method:'POST',async:false,scope:this,
		params:params,
		success:function(response,options){
		//alert(response.responseText);
		varrsInfo=Ext.util.JSON.decode(response.responseText);
			varhaveDays=comb.ownerCt.getComponent('havDays')
			//注意這里的引用方式
			if(rsInfo.success){
			haveDays.setValue(rsInfo.data);
			}else{
			
			}
		}),
}
},
},
}
});

varhavDays=newExt.form.NumberField({name:'havDays',itemId:'havDays',
fieldLabel:'年假剩餘天數',
value:0,});

『玖』 extjs如何讓下拉列表展開

extjs中直接顯示展開的下拉列表：

Ext.ux.TreeCombo = Ext.extend(Ext.form.ComboBox, {
constructor : function(cfg) {
cfg = cfg || {};
Ext.ux.TreeCombo.superclass.constructor.call(this, Ext.apply({
maxHeight : 300,
editable : false,
mode : 'local',
triggerAction : 'all',
rootVisible : false,
selectMode : 'all'
}, cfg));
},
store : new Ext.data.SimpleStore({
fields : [],
data : [[]]
}),
// 重寫onViewClick，使展開樹結點是不關閉下拉框
onViewClick : function(doFocus) {
var index = this.view.getSelectedIndexes()[0], s = this.store, r = s.getAt(index);
if (r) {
this.onSelect(r, index);
}
if (doFocus !== false) {
this.el.focus();
}
},
tree : null,
// 隱藏值
hiddenValue : null,
getHiddenValue : function() {
return this.hiddenValue;
},
setHiddenValue : function(code, dispText) {
this.setValue(code);
Ext.form.ComboBox.superclass.setValue.call(this, dispText);
this.hiddenValue = code;
},
initComponent : function() {
var _this = this;
var tplRandomId = 'deptcombo_' + Math.floor(Math.random() * 1000) + this.tplId
this.tpl = "<div style='height:" + _this.maxHeight + "px' id='" + tplRandomId + "'></div>"
this.tree = new Ext.tree.TreePanel({
border : false,
enableDD : false,
enableDrag : false,
rootVisible : _this.rootVisible || false,
autoScroll : true,
trackMouseOver : true,
height : _this.maxHeight,
lines : true,
singleExpand : true,
root : new Ext.tree.AsyncTreeNode({
id : _this.rootId,
text : _this.rootText,
leaf : false,
border : false,
draggable : false,
singleClickExpand : false,
hide : true
}),
loader : new Ext.tree.TreeLoader({
dataUrl : _this.url
})
});
this.tree.on('click', function(node) {
if ((_this.selectMode == 'leaf' && node.leaf == true) || _this.selectMode == 'all') {
// if (node.parentNode && node.parentNode.attributes.id != '000000') {
var dispText = node.text;
var code = node.id;
while (node.parentNode && node.parentNode.attributes.id != '000000') {
if (node.parentNode.text != dispText) {
dispText = node.parentNode.text + dispText;
}
node = node.parentNode;
}
_this.setHiddenValue(code, dispText);
_this.collapse();
}
});
this.on('expand', function() {
this.tree.render(tplRandomId);
});
Ext.ux.TreeCombo.superclass.initComponent.call(this);
}
})
Ext.reg("treecombo", Ext.ux.TreeCombo);

只要設置singleExpand : true, 即可！

『拾』 ExtJs grid 如何實現按照每一列進行篩選

store 有一個 filter 方法。
store.filter(columnIndex, searchValue);
columnIndex - 要過濾的欄位的 dataIndex
searchValue - 過濾條件

但是在數據龐大或者數據改動比較多的系專統里不建議這屬么做。
本地過濾意味著第一次查詢要查詢所有的數據，這樣會很慢。
再就是如果一直保持者第一次查詢的數據的話，數據准確性也很低。