ExtJS GridPanel

Question

में लंबवत स्क्रॉलबार मैं एक ऐसे प्रोजेक्ट पर काम कर रहा हूं जहां मेरे पास एक पृष्ठ पर एक ग्रिडपैनल है। पैनल किसी भी पंक्तियों को प्रदर्शित कर सकता है और मेरे पास ऑटोहेइट प्रॉपर्टी सेट है, जो ग्रिडपैनल को पंक्तियों की संख्या में फिट करने का कारण बनता है। अब मैं एक क्षैतिज स्क्रॉलबार चाहता हूं क्योंकि कुछ संकल्पों पर सभी कॉलम प्रदर्शित नहीं होते हैं (और मैं कॉलम की संख्या को कम नहीं कर सकता)।

अगर मैं autoHeight सेट करता है, तो मैं इसे सेट और एक निश्चित ऊंचाई मैं एक क्षैतिज स्क्रॉलबार लेकिन GridPanel जाहिर पंक्तियों की संख्या से मेल नहीं खाती है निर्धारित नहीं करते हैं मैं, कोई क्षैतिज स्क्रॉलबार है ....

इसे ठीक करने के लिए क्या ऐसा कुछ है, जो मेरे लिए करना संभव है? मुझे ऐसी संपत्ति नहीं मिल रही है जो मुझे आवश्यक परिणाम प्राप्त करेगी।

Answer 1

यह अपने लेआउट सेटिंग में कुछ समस्या की तरह लगता है के रूप में वस्तु गुण के लिए विरोध किया।

पैरेंट कंटेनर के लिए 'fit'- आप भी एक कोड अंश प्रदान कर सकते हैं का लेआउट संपत्ति की स्थापना का प्रयास करें?

Answer 2

रूप Ergo ने कहा, यह अधिक संभावना है कि एक स्वरूप की समस्या है - GridPanel, पर्याप्त उच्च एक स्क्रॉलबार लेकिन पूरी तरह दिखाई नहीं की जरूरत नहीं है, स्पष्ट रूप से शायद यह युक्त पैनल से अधिक है। ग्रिडपैनल को एक उचित लेआउट के साथ कंटेनर में रखें, यानी सीमा लेआउट, फिट लेआउट या कार्ड लेआउट। लेआउट प्रबंधकों को प्राप्त करना आमतौर पर ExtJS-Fu का सबसे कठिन हिस्सा है।

Answer 3

मेरे सोचा panel.Panel कि ग्रिड निहित पर autoScroll: true स्थापित करने के लिए किया जाएगा।

Answer 4

आप देखेंगे कि आपके ग्रिड कक्ष के आसपास किसी पैरेंट कंटेनर (Ext.panel.Panel या वास्तव में किसी भी कंटेनर) डाल सफल होने के लिए मिल जाएगा। यदि आप पैरेंट कंटेनर पर ऊंचाई, चौड़ाई और लेआउट ('फिट' करने के लिए) को कड़ी मेहनत करते हैं, तो बच्चे की वस्तु (Ext.grid.Panel) अपने मूल कंटेनर से उपलब्ध संपूर्ण स्थान को भरने के लिए विस्तारित होगी।

पेज 80 और 81 के अतिरिक्त जेएस 4 वेब अनुप्रयोग विकास कुकबुक देखें।

आप Ext.grid.Panel 'के लिए आलसी इन्स्टेन्शियशन संकेतन का उपयोग कर सकते हैं। मतलब आपके बच्चे के कंटेनर (आइटम) xtype संपत्ति के लिए 'ग्रिड' का उपयोग करें।

Ext.create('Ext.panel.Panel', { 
    title: 'parent container', 
    width: 800, 
    height: 600, 
    layout: 'fit', 
    items: { 
     xtype: 'grid', 
     title: 'child container', 

     ... define your grid here 

    }, 
    renderTo: 'grand parent container' 
}); 

Answer 5

viewConfig = { 
     scroll:false, 
     style:{overflow: 'auto',overflowX: 'hidden'} 
    } 

जोड़ने कभी कभी 2 स्क्रॉलबार प्रदर्शित साथ एक बग का कारण बनता है। मेरे मामले में इसे रोकने के लिए मैंने एक श्रोता जोड़ा। और फिर ठीक काम करता है।

this.on('scrollershow',function(scroller,orientation,eOpts){ 
     if (orientation=='vertical'){ 
      scroller.hide();     
     } 
},this);