使jqGrid的cb列更寬

我正在使用free-jqGrid和jqGrid可以選擇您的選擇複選框到網格上。在我的網格中，我有兩列，開頭是jqGrid，並沒有備份我自己的數據：記錄號列'rn'和記錄選擇複選框'cb'（在我的情況下爲多選）。使jqGrid的cb列更寬

我在引導網站上使用了jqGrid，所以當loadComplete事件發生時，我會將'from-control'類添加到許多編輯中，例如每列搜索框以及基本上可以在頁面上找到的每個編輯。（我也將每個醜陋的小圖標替換爲glyphicons。我操縱工具欄按鈕的DOM，使它們成爲真正的按鈕，所以它們看起來更漂亮，並且chardin.js可以很好地工作，等等等等。順便說一句，我不確定這是否是最佳做法，我找不到一個更好的方法來使jqGrid更具啓發性，但這可能是另一個問題）。

當您將form-control類應用於複選框時，它會變得越來越多。這是有益的，因爲點擊它更容易，你不需要放大鏡玻璃（就像原來的小複選框）。我可以很好地調整所有這些數據列的列大小，但我無法弄清楚如何擴大cb列，以便它可以容納臃腫的複選框。

我想在我的colModel增加一個配置爲該列：

兩個

{ 
    name: 'cb', 
    width: 38, 
    align: 'center', 
    sortable: false, 
}

和

{ 
    width: 38, 
    align: 'center', 
    sortable: false, 
}

失敗了，我得到了一個錯誤，從jqGrid指出數量爲colModels與提供的數據數量不匹配。這是真的，因爲cb列背後的數據不是由我備份的。

我試圖在loadComplete

var $ajaxGrid = $("#ajaxGrid"); 
$ajaxGrid.jqGrid('setColProp', 'cb', { width: 38 });

這並沒有給我一個錯誤，也沒有任何改變。也許我應該把它放到另一個事件處理程序中？哪一個？

然後我試圖下井操縱的顛簸的道路：

$("#ajaxGrid_cb").css("width", "38px"); 
$(".td_cbox").css("width", "38px");

正如所看到的我分別擴大頭部和td元件。但是這會導致表格水平滾動條出現。呸！我試圖對電網翻滾深入到黑客孔，使更廣泛的列窄，使滾動條消失，但這並沒有幫助：

$("#ajaxGrid_Name").css("width", "435px"); 
$('td[aria-describedby="ajaxGrid_Name"]').css("width", "435px");

必須有辦法。現在它很醜。截圖：

（另一種風格的問題，你也可以看到對於Combined專欄中，我指定的colModelalign: 'center'，但它沒有任何效果。）

來源

2016-02-07 Csaba Toth

您可以使用multiselectWidth指定的寬度多選列：

multiselectWidth: 38

還有一個選擇：你可以改變列寬度以後使用setColWidth這是免費的jqGrid的一部分。我將the answer最初的方法作爲插件引入到舊的jqGrid版本中。因此以下，例如，將工作太：

onInitGrid: function() { 
    $(this).jqGrid("setColWidth", "cb", 38); 
}

的onInitGrid回調或jQuery的事件「jqGridInitGrid」的好地方，在這裏可以修改網格將被加載數據之前。

P.S.我現在正在努力在免費的jqGrid中包含更好的Bootstrap支持。在下一個版本的jqGrid中，可能只需要使用guiStyle: "bootstrap"即可使jqGrid處於「Bootstrap風格」。

來源

2016-02-07 15:38:59 Oleg

很多很好的信息和感謝偉大的工作。我使用jqGrid的特定項目不是開源的，但我可以私下分享一些相關的代碼，我如何替換圖標和自定義引導。 –

@CsabaToth：不客氣！ [演示]（http://www.ok-soft-gmbh.com/jqGrid/OK/formEditOnDoubleClick-bootstrap1.htm）使用'guiStyle：「bootstrap」，iconSet：「fontAwesome」'選項和來自GitHub的最新源代碼。您的反饋對我來說非常有趣。 – Oleg

快速評論演示：頂部和底部工具欄之間的大小差異：工具欄左側的按鈕在底部工具欄上比頂部大。雖然中間的尋呼機部分是相反的：頂部比底部稍大一些。 fa複選框很棒，也許展開/摺疊按鈕（右上角）也可能是字體太棒了。我看到編輯對話框有窗體控件，我的網格已經就地編輯，我希望就地編輯也有從控制輸入。謝謝！ –

使jqGrid的cb列更寬

回答

相關問題