JQGrid Sütun otomatik genişliği

Question

Sadece jqGrid sütun genişliğini otomatik olarak nasıl ayarlayabileceğimizi merak ediyorum? o maksimum içeriğin boyutuna sığacak şekilde ben sütun için bir oto genişliğini belirtebilirsiniz nasıl açıklamalardan

... 
colModel: [ 
{ name: 'MyDescription', index: 'description', align: 'left', width: 150, sortable: false }, 
... 

.

Answer 1

jqGrid'de otomatik genişlik sütununu belirtmenin yolu yoktur. Ancak, bir ızgara kümesinin shrinkToFit seçeneğini true olarak ayarlayabilir ve yaklaşık genişlik değerlerini (ör. 20, 20, 20, 80) ayarlayabilir ve sütunların genişliği bir ızgara genişliğine ölçeklendirilecektir.

shrinkToFit:

Bu seçenek, ızgara genişliğine karşı her bir kolonun ilk genişliği hesaplama türünü tarif eder. Değer true ise ve width seçeneğindeki değer ayarlanırsa: Her sütun genişliği tanımlı seçenek genişliğine göre ölçeklenir. Örnek: 80 ve 120 piksel genişliğinde iki sütun tanımlamak, ancak kılavuzun 300 piksel olmasını istiyorsanız, sütunlar aşağıdaki gibi yeniden hesaplanır: 1- sütun = 300 (yeni genişlik)/200 (tüm genişlik toplamı)) * 80 (sütun genişliği) = 120 ve 2 sütun = 300/200 * 120 = 180'dir. Izgara genişliği 300 pikseldir. Değer yanlışsa ve genişlik seçeneğindeki değer ayarlanırsa: Izgara genişliği, ayarlanan genişlik seçeneğidir. Sütun genişliği yeniden hesaplanmaz ve colModel'de tanımlanan değerlere sahiptir.

Answer 2

Genişliklerini koruduğunu hatırladığım kadarıyla tableToGrid'u kullanmayı deneyebilirsiniz. Eğer öyleyse, davranışları tamamen sizin ihtiyaçlarınıza uymuyorsa, kaynak koduna da bakabilirsiniz.

Answer 3

setGridWidth yöntemini kullanabilirsiniz.

Örnek:

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

DEMO

Answer 4

Bu, çoğunlukla benim için çalışıyor.

<div id="myjqgridwrapper" style="width:100%;"> 
    <table id="myjqgrid"></table> 
    <div id="myjqgridfooter"></div> 
</div> 

<script type="text/javascript"> 
    //script to autosize grid 
    //don't forget autowidth:true for initial size 
    $(window).bind('resize', function(){ 
     //set to 0 so grid does not continually grow 
     $('#myjqgrid').setGridWidth(0); 
     //resize to our container's width 
     $('#myjqgrid').setGridWidth($('#myjqgridwrapper').width()); 
    }).trigger('resize'); 
</script> 

Answer 5

Try this. Worked For Me 

.ui-common-table{ 
    width: 100% !important; 
} 

.ui-jqgrid .ui-jqgrid-hbox{ 
    padding-right: 0px !important; 
}