दिलचस्प पोस्ट
कैसे डॉस बैच newline चर हैक काम करता है समझाओ शीर्ष स्तर की विंडो को पुनर्निर्देशित करने से IFRAME को कैसे रोकें C # को सी ++ शैली 'मित्र' कीवर्ड क्यों नहीं प्रदान करता है? मणि स्थापित करने में असमर्थ – मणि देशी एक्सटेंशन बनाने में विफल – ऐसी फ़ाइल लोड नहीं कर सकता – mkmf (LoadError) मैं PHP के साथ एक JSON फ़ाइल को कैसे पार्स कर सकता हूं? SQLParameter एसक्यूएल इंजेक्शन कैसे रोकता है? मध्यवर्ती पाठ को एक <hr /> – जैसा लाइन के बीच में जोड़ें मुझे क्यों "एक्सेस-कंट्रोल-अनुमति-उत्पत्ति द्वारा त्रुटि की अनुमति नहीं है" त्रुटि देख रहा हूं? ग्रिडलेआउट के अंदर तत्व के एक्स और वाई सूचकांक कैसे प्राप्त करें? सी # में स्थैतिक चर का उपयोग क्या है? इसे कब उपयोग करना है? मैं विधि के भीतर स्थिर वैरिएबल क्यों नहीं घोषित कर सकता हूं? सभी फ़ील्ड के मान होने तक सबमिट बटन को अक्षम करना क्या मैं div की पृष्ठभूमि-छवि यूआरएल प्राप्त कर सकता हूं? मैं jQuery के साथ एक पृष्ठ कैसे रिफ्रेश कर सकता हूं? सूची में बटनों के साथ सूचीकरण में ListItemClick पर आग कैसे करें? आईआईएस AppPoolIdentity और फाइल सिस्टम लिखने के लिए अनुमतियाँ

ब्राउज़र का आकार बदलते समय jqGrid का आकार बदलें?

क्या ब्राउज़र विंडो का पुनःआकार किया जा रहा है जब एक jqGrid का आकार बदलने का कोई तरीका है? मैंने यहाँ वर्णित विधि की कोशिश की है लेकिन यह तकनीक आईई 7 में काम नहीं करता है।

वेब के समाधान से एकत्रित समाधान "ब्राउज़र का आकार बदलते समय jqGrid का आकार बदलें?"

यह कुछ समय के लिए किसी भी शिकायत के बिना उत्पादन में उपयोग किया गया (उदाहरण के लिए, अपनी साइडबार की चौड़ाई को घटाना आदि के लिए कुछ झुकाव लग सकता है)

$(window).bind('resize', function() { $("#jqgrid").setGridWidth($(window).width()); }).trigger('resize'); 

एक अनुवर्ती के रूप में:

इस पोस्ट में दिखाए गए पिछले कोड को अंततः छोड़ दिया गया था क्योंकि यह अविश्वसनीय था। मैं अब ग्रिड का आकार बदलने के लिए निम्न API फ़ंक्शन का उपयोग कर रहा हूं, जैसा कि jqGrid प्रलेखन द्वारा अनुशंसित है:

 jQuery("#targetGrid").setGridWidth(width); 

वास्तविक रीसाइजिंग करने के लिए, निम्न तर्क को कार्यान्वित करने वाला फ़ंक्शन विंडो के आकार के इवेंट में बाध्य है:

  • ग्रिड की चौड़ाई की गणना उसके माता-पिता के क्लाइंटविड्थ और (यदि वह उपलब्ध नहीं है) इसके ऑफ़सेटविड्थ विशेषता के आधार पर करें।

  • सुनिश्चित करें कि चौड़ाई में एक्स पिक्सेल (कुछ एप्लिकेशन-विशिष्ट समस्याओं के आसपास काम करने के लिए) से अधिक बदल गया है, यह सुनिश्चित करने के लिए एक विवेकपूर्ण जांच करें

  • अंत में, ग्रिड की चौड़ाई बदलने के लिए setGridWidth () का उपयोग करें

रीसाइजिंग को संभालने के लिए यहां उदाहरण कोड है:

 jQuery(window).bind('resize', function() { // Get width of parent container var width = jQuery(targetContainer).attr('clientWidth'); if (width == null || width < 1){ // For IE, revert to offsetWidth if necessary width = jQuery(targetContainer).attr('offsetWidth'); } width = width - 2; // Fudge factor to prevent horizontal scrollbars if (width > 0 && // Only resize if new width exceeds a minimal threshold // Fixes IE issue with in-place resizing when mousing-over frame bars Math.abs(width - jQuery(targetGrid).width()) > 5) { jQuery(targetGrid).setGridWidth(width); } }).trigger('resize'); 

और उदाहरण मार्कअप:

 <div id="grid_container"> <table id="grid"></table> <div id="grid_pgr"></div> </div> 

ऑटो आकार परिवर्तन:

JQgrid 3.5+ के लिए

  if (grid = $('.ui-jqgrid-btable:visible')) { grid.each(function(index) { gridId = $(this).attr('id'); gridParentWidth = $('#gbox_' + gridId).parent().width(); $('#' + gridId).setGridWidth(gridParentWidth); }); } 

Jqgrid 3.4.x के लिए:

  if (typeof $('table.scroll').setGridWidth == 'function') { $('table.scroll').setGridWidth(100, true); //reset when grid is wider than container (div) if (gridObj) { } else { $('#contentBox_content .grid_bdiv:reallyvisible').each(function(index) { grid = $(this).children('table.scroll'); gridParentWidth = $(this).parent().width() – origami.grid.gridFromRight; grid.setGridWidth(gridParentWidth, true); }); } } 

यह मेरे लिए अच्छी तरह काम कर रहा है

 $(window).bind('resize', function() { jQuery("#grid").setGridWidth($('#parentDiv').width()-30, true); }).trigger('resize'); 

मैं लेआउट के लिए 960.gs का उपयोग कर रहा हूं ताकि मेरा समाधान निम्नानुसार हो:

  $(window).bind( 'resize', function() { // Grid ids we are using $("#demogr, #allergygr, #problemsgr, #diagnosesgr, #medicalhisgr").setGridWidth( $(".grid_5").width()); $("#clinteamgr, #procedgr").setGridWidth( $(".grid_10").width()); }).trigger('resize'); // Here we set a global options jQuery.extend(jQuery.jgrid.defaults, { // altRows:true, autowidth : true, beforeSelectRow : function(rowid, e) { // disable row highlighting onclick return false; }, datatype : "jsonstring", datastr : grdata, // JSON object generated by another function gridview : false, height : '100%', hoverrows : false, loadonce : true, sortable : false, jsonReader : { repeatitems : false } }); // Demographics Grid $("#demogr").jqGrid( { caption : "Demographics", colNames : [ 'Info', 'Data' ], colModel : [ { name : 'Info', width : "30%", sortable : false, jsonmap : 'ITEM' }, { name : 'Description', width : "70%", sortable : false, jsonmap : 'DESCRIPTION' } ], jsonReader : { root : "DEMOGRAPHICS", id : "DEMOID" } }); 

// नीचे परिभाषित अन्य ग्रिड …

अपने लिंक पर कोड से उधार लेना आप इस तरह से कुछ कोशिश कर सकते हैं:

 $(window).bind('resize', function() { // resize the datagrid to fit the page properly: $('div.subject').children('div').each(function() { $(this).width('auto'); $(this).find('table').width('100%'); }); }); 

इस तरह आप सीधे खिड़की पर बाध्य हो रहे हैं.ओनेसीज़ इवेंट, जो वास्तव में आपके प्रश्न से आप क्या चाहते हैं

यदि आपकी ग्रिड 100% चौड़ाई पर सेट है, हालांकि इसके कंटेनर का विस्तार होने पर इसे स्वचालित रूप से विस्तार किया जाना चाहिए, जब तक कि आपके द्वारा उपयोग किए जा रहे प्लगइन की कुछ जटिलताएं न हों, जिन्हें मैं नहीं जानता।

मुख्य उत्तर मेरे लिए काम किया, लेकिन आईई में बेहद अनुत्तरदायी ऐप बनाया, इसलिए मैंने सुझाव के अनुसार टाइमर का उपयोग किया। कोड ऐसा कुछ दिखता है ( $(#contentColumn) कॉलम $(#contentColumn) वह div है जिसे JQGrid बैठता है):

  function resizeGrids() { var reportObjectsGrid = $("#ReportObjectsGrid"); reportObjectsGrid.setGridWidth($("#contentColumn").width()); }; var resizeTimer; $(window).bind('resize', function () { clearTimeout(resizeTimer); resizeTimer = setTimeout(resizeGrids, 60); }); 

नमस्ते ढेर अतिप्रवाह उत्साही मुझे बहुत अधिक उत्तर मिला, और मैंने भी एक जोड़े को वोट किया, लेकिन उनमें से कोई भी कुछ अजीब कारणों से IE 8 पर मेरे लिए काम नहीं किया … हालांकि मैं इन लिंक्स में चला था … इस व्यक्ति ने एक लाइब्रेरी लिखी जो लगता है काम। इसे jquery UI के अनुकूलन में अपनी परियोजनाओं में शामिल करें, अपनी तालिका और div के नाम पर फेंक दें

http://stevenharman.net/blog/archive/2009/08/21/creating-a-fluid-jquery-jqgrid.aspx

http://code.google.com/p/codeincubator/source/browse/#svn%2FSamples%2Fsteveharman%2FjQuery%2Fjquery.jqgrid.fluid%253Fstate%253Dclosed

अगर तुम:

  • shrinkToFit: false (निश्चित चौड़ाई स्तंभ)
  • है autowidth: true
  • द्रव की ऊंचाई के बारे में परवाह नहीं है
  • क्षैतिज स्क्रॉलबार है

आप निम्न शैलियों के साथ तरल पदार्थ की चौड़ाई के साथ ग्रिड कर सकते हैं:

 .ui-jqgrid { max-width: 100% !important; width: auto !important; } .ui-jqgrid-view, .ui-jqgrid-hdiv, .ui-jqgrid-bdiv { width: auto !important; } 

यहां एक डेमो है

 autowidth: true 

मेरे लिए पूरी तरह से काम किया यहां से सीखा

यह काम..

 var $targetGrid = $("#myGridId"); $(window).resize(function () { var jqGridWrapperId = "#gbox_" + $targetGrid.attr('id') //here be dragons, this is generated by jqGrid. $targetGrid.setGridWidth($(jqGridWrapperId).parent().width()); //perhaps add padding calculation here? }); 
 <script> $(document).ready(function(){ $(window).on('resize', function() { jQuery("#grid").setGridWidth($('#fill').width(), false); jQuery("#grid").setGridHeight($('#fill').height(),true); }).trigger('resize'); }); </script> 

इसे इस्तेमाल करे:

 width: null shrinkToFit: true