एक extjs 3 कॉलम पैनल में कॉलम को दिखाने/छुपाने के लिए कैसे करें

Question

मेरे पास एक ग्रिड पैनल है जो मुझे चेकबॉक्स के मूल्य के आधार पर ग्रिड पैनल में कॉलम दिखाने/छुपाने की आवश्यकता है। यदि चेकबॉक्स चेक किया गया है तो मुझे ग्रिड में कॉलम प्रदर्शित करने की आवश्यकता है और यदि यह अनचेक किया गया है तो मुझे ग्रिड में कॉलम छिपाने की आवश्यकता है।

यहाँ मेरी कोड

var chkEnableDisplayResponsibilityForAction = '<%=Session["chkEnableDisplayResponsibilityForAction"]%>'; 

var flags = Boolean.parse(chkEnableDisplayResponsibilityForAction); 
var flags1 = !Boolean.parse(chkEnableDisplayResponsibilityForAction) 

var colModel = new Ext.grid.ColumnModel([ 
{ header: "PricePlanID", width: 100, sortable: true, dataIndex: 'PricePlanID', hidden: flags, hideable: flags1 }, 
    ]); 

जब मैं पेज मैं चेकबॉक्स के मूल्य के आधार स्तंभों टॉगल करने के लिए सक्षम नहीं हूँ ताज़ा है। लेकिन जब मैं लॉगिन करता हूं और लॉग आउट करता हूं तो मैं ग्रिड पैनल में बदलाव देख सकता हूं। क्या कोई मुझे ग्रिड पैनल में कॉलम मानों को रीफ्रेश करने में मदद कर सकता है?

Answer 1

यदि एक्स्टजेएस एपीआई पर एक नज़र डालें, ColumModel कणिका setHidden विधि है, तो यह GridPanel में एक कॉलम छुपा/दिखाएगा।

myGrid.getColumnModel().setHidden(0, true); 

आप भी अपने चेक बॉक्स का onchange घटना हुक चाहिए, ताकि आप दिखाना या स्तंभ छुपा सकते हैं

Answer 2

आप इसे कॉलम हेडर मेनू का उपयोग कर/छिपाने कॉलम दिखा सकती है - आप चुन सकते हैं जो स्तंभ आप करना चाहते हैं दिखाया गया है। वैसे भी, अगर आप को दिखाने/एक स्तंभ छुपाना चाहते हैं, किसी स्तंभ को छिपाने के लिए इस

myGrid.getColumnModel().setHidden(0, true); 

Answer 3

Ext जे एस 4.1 में प्रयास करते हैं, के लिए, आप का उपयोग करें:

grid.columns[0].setVisible(false); 

अपने setHidden (साथ) getColumnModel (ऐसा लगता है) विधि ग्रिड का भाग नहीं है: http://docs.sencha.com/ext-js/4-1/#!/api/Ext.grid.Panel

Answer 4

अपने ग्रिड पैनल के लिए ExtJS 4 लाभ पहुँच में, और उसके बाद का उपयोग विशेषता कॉलम को जो कॉलम में ऑब्जेक्ट की श्रृंखला है।

वहां से आप एक क्रिया करने के लिए सरणी इटरेटर विधियों (http://www.diveintojavascript.com/core-javascript-reference/the-array-object) का उपयोग कर सकते हैं।

नीचे दिए गए उदाहरण में मैं उनके शीर्षलेख नामों के आधार पर कुछ कॉलम छुपाता हूं और दिखाता हूं, लेकिन आप स्पष्ट रूप से किसी भी कॉलम विशेषता के आधार पर कार्रवाई कर सकते हैं।

var grid = Ext.getCmp('my_grid_panel'); 

grid.columns.forEach(function(col) { 
    if((col.text == "Foo") || (col.text == "Bar")) { 
     col.setVisible(true); 
    } else if(col.text == "Baz") { 
     col.setVisible(false); 
    } 
}); 

Answer 5

ऊपर दिए गए उत्तर मुझे लगता है कि बहुत अच्छा है। लेकिन मुझे आपको सलाह देने दो।

1) में ExtJS 4.x यह Ext.ComponentQuery `रों Ext.getCmp()

2) ग्रिड के/शो स्तंभों को छुपाने के लिए के बजाय तरीकों का उपयोग करने के लिए सिफारिश की है आप कोड निम्नलिखित

Ext.ComponentQuery.query('grid gridcolumn[dataIndex^="service"]')[0].hide() 

या दिखाने के लिए उपयोग कर सकते हैं

Ext.ComponentQuery.query('grid gridcolumn[dataIndex^="service"]')[0].show() 

इसे ग्रिड में किसी भी कॉलम को छिपाने/दिखाने का समाधान करना चाहिए।

यहां ग्रिड आपकी ग्रिड है, यह शायद आईडी या xtype इत्यादि है।दो मिनट में

Answer 6

setVisibleColumn  : function(name, flag) { 
    name = Ext.Array.from(name); 
    var column; 

    for (var i = 0; i < name.length; i++) { 
     column = this.getColumn(name[i]); 
     if (column) { 
      flag ? column.show() : column.hide(); 
     } 
    } 

}