पंक्तियों की संख्या के आधार पर jqGrid का आकार बदलें?

Question

मैं चाहता हूं कि मेरी jqGrid को पंक्तियों की संख्या के आधार पर संक्षिप्त करें और विस्तार करें। मान लें कि वर्तमान में इसमें 10 पंक्तियां हैं, jqGrid की ऊंचाई 10 पंक्तियों तक घट जाएगी (ताकि कोई भी खाली खाली पंक्तियां उजागर न हों)।

यदि बहुत सारी पंक्तियां हैं, तो ग्रिड की ऊंचाई अधिकतम 'ऊंचाई' मान तक बढ़ जाएगी और स्क्रॉल बार दिखाई देगा।

Answer 1

यह ग्रिड में बनाया गया है। आपने height से 100% सेट किया है। There's a demo on this page तुम जाओ "उन्नत करता है, तो -> रीसाइज़िंग

Answer 2

कॉल afterInsertRow से नीचे समारोह और जब एक पंक्ति को हटाने:

function adjustHeight(grid, maxHeight){ 
    var height = grid.height(); 
    if (height>maxHeight)height = maxHeight; 
    grid.setGridHeight(height); 
} 

Answer 3

प्रयास करें:

jQuery(".ui-jqgrid-bdiv").css('height', jQuery("#bigset").css('height')); 

jQGrid कॉलबैक फ़ंक्शन loadComplete में #bigset।। मेरे द्वारा उपयोग की जाने वाली तालिका के लिए id है। यह मेरे लिए पूरी तरह से काम करता है।

Answer 4

हालांकि ऊंचाई 100% wo डेमो में ठीक है, यह मेरे लिए काम नहीं किया। ग्रिड बहुत बड़ा हो गया, शायद यह पैरेंट div की ऊंचाई पर कब्जा करने की कोशिश की। अमित का समाधान मेरे लिए पूरी तरह से काम करता है, धन्यवाद! (मैं यहां एक योगदानकर्ता के रूप में नया हूं, और इसलिए किसी भी वोट को चिह्नित करने के लिए उच्च 'प्रतिष्ठा' की आवश्यकता है :))

Answer 5

मुझे इसी तरह की समस्या का सामना करना पड़ा है और समाधानों में से कोई भी मेरे लिए पूरी तरह से काम नहीं करता है। कुछ काम लेकिन फिर कोई स्क्रॉलबार नहीं है।

तो यहाँ मैं क्या किया है:

jQuery("#grid").jqGrid('setGridHeight', Math.min(300,parseInt(jQuery(".ui-jqgrid-btable").css('height')))); 

इस कोड loadComplete हैंडलर में रखा जा रहा है और फिर इसे ठीक काम करता है। सूची में भरने के लिए पर्याप्त डेटा होने पर Math.min का पहला पैरामीटर वांछित ऊंचाई है। ध्यान दें कि यह वही मान ग्रिड के लिए ऊंचाई के रूप में सेट किया जाना है। यह स्क्रिप्ट न्यूनतम ऊंचाई और ग्रिड की वांछित ऊंचाई को कम करती है। तो यदि पर्याप्त पंक्तियां नहीं हैं तो ग्रिड ऊंचाई कम हो जाती है, अन्यथा हमारे पास हमेशा एक ही ऊंचाई होती है!

Answer 6

यहां एक सामान्य विधि है जो मैं अमित के समाधान के आधार पर आया था। यह आपको प्रदर्शित करने के लिए पंक्तियों की अधिकतम संख्या निर्दिष्ट करने की अनुमति देगा। यह अधिकतम ऊंचाई की गणना करने के लिए ग्रिड की शीर्षलेख ऊंचाई का उपयोग करता है। यदि आपकी पंक्तियां आपके शीर्षलेख के समान ऊंचाई नहीं हैं तो इसे tweeking की आवश्यकता हो सकती है। आशा करता हूँ की ये काम करेगा।

function resizeGridHeight(grid, maxRows) { 
    // this method will resize a grid's height based on the number of elements in the grid 
    // example method call: resizeGridHeight($("#XYZ"), 5) 
    // where XYZ is the id of the grid's table element 
    // DISCLAIMER: this method is not heavily tested, YMMV 

    // gview_XYZ is a div that contains the header and body divs 
    var gviewSelector = '#gview_' + grid.attr('id'); 
    var headerSelector = gviewSelector + ' .ui-jqgrid-hdiv'; 
    var bodySelector = gviewSelector + ' .ui-jqgrid-bdiv'; 

    // use the header's height as a base for calculating the max height of the body 
    var headerHeight = parseInt($(headerSelector).css('height')); 
    var maxHeight = maxRows * headerHeight; 

    // grid.css('height') is updated by jqGrid whenever rows are added to the grid 
    var gridHeight = parseInt(grid.css('height')); 
    var height = Math.min(gridHeight, maxHeight); 
    $(bodySelector).css('height', height); 
} 

Answer 7

loadComplete समारोह के अंदर कोड के नीचे जोड़ें

var ids = grid.jqGrid('getDataIDs'); 
//setting height for grid to display 15 rows at a time 
if (ids.length > 15) { 
    var rowHeight = $("#"+gridId +" tr").eq(1).height(); 
    $("#"+gridId).jqGrid('setGridHeight', rowHeight * 15 , true); 
} else { 
//if rows are less than 15 then setting height to 100% 
    $("#"+gridId).jqGrid('setGridHeight', "100%", true); 
}