jqGrid分組行重寫「間隔」列，我建立到我的網格

當我添加分組到網格它工作很好，除了一個問題。包含分組信息的行正在用網格的「寬度」的網格構建，這意味着它位於構建到網格中的某些垂直列的頂部，以幫助添加視覺分隔 enter image description here 。jqGrid分組行重寫「間隔」列，我建立到我的網格

有沒有辦法讓這一行不跳過那一列，這樣我就可以在我的網格中的部分之間保持一個很好的視覺中斷？

更新： 我通過以下的方法過程中添加這些垂直的「間隔體」的列： -in所述的jqGrid設置

beforeProcessing: function (data, status, xhr) { 
     //add the spaces to the returned data to allow for the blank vertical columns in the grid 
     for (var x = 0, length = data.rows.length; x < length; x++) { 
      data.rows[x].cell.splice(6, 0, ""); 
     } //for 
    }, //beforeProcessing

-colmodel設置匹配將包含「空間」

細胞

{ name: "empty1" ,width: 10, sortable: false, hidedlg: true, search: false, resizable: false, fixed: true, classes: 'NoHorizontalGridBorders' },

-CSS

.NoHorizontalGridBorders { border-bottom-color: transparent !important; background-color: White !important;}

來源

2013-07-09 Mark

您應該提供一個演示（例如，在[jsfiddle]（http://jsfiddle.net/）中），它可以重現問題。你談論「間隔」欄目，但不清楚你是如何實施這些欄目的。 – Oleg

@Oleg我更新了更多的細節，我會根據你的帖子在Oleg的某個位置混合使用這個方法，而且他們在開始使用分組時只注意到了我注意到的這個小問題。如果上面沒有給出完整的圖片，我可以嘗試一起扔一個jsfiddle例子。 – Mark

好的我現在提醒我關於密切的問題，但我仍然不確定你想如何分組行。你想在「空」列中的行之間沒有水平線嗎？那麼處於摺疊狀態的行呢？ – Oleg

如果我理解正確，你需要修改loadComplete中的分組線。例如the following demo，其是從the answer的the demo變形例中，顯示下面的格子

enter image description here

的代碼非常簡單：

loadComplete: function() { 
    var $groupingHeaders = $(this).find(">tbody>tr.jqgroup"); 
    $groupingHeaders.find(">td").addClass("noVerticalLines").attr("colspan", "1"); 
    $groupingHeaders.append("<td class='noHorizLines noVerticalLines'>&nbsp;</td>" + 
     "<td colspan='3' class='noVerticalLines'>&nbsp;</td>" + 
     "<td class='noHorizLines noVerticalLines'>&nbsp;</td>" + 
     "<td colspan='2'>&nbsp;</td>"); 
}

其中所述類別noHorizLines和noVerticalLines CSS定義爲

.ui-jqgrid tr.ui-row-ltr td.noVerticalLines { border-right-color: transparent; } 
.ui-jqgrid tr.ui-row-ltr td.noHorizLines { border-bottom-color: transparent; }

同樣在你可以修改上面的代碼來製作其他一些效果（水平線或垂直線，在你想要的地方）。

來源

2013-07-09 19:14:58 Oleg

嗡嗡聲，這似乎是正確的路徑，剩下的唯一技巧是我有一個按鈕，可以根據用戶的喜好切換許多列的可見性。您是否看到任何方式圍繞這個？ – Mark

同樣，非常感謝您花時間，我怎麼給你買一瓶啤酒！ – Mark

@Mark：對不起，但我不明白你的意思是什麼「一個按鈕，可以切換數字的可視性根據用戶的偏好設置列「你確切地知道了哪個問題？我只是增加了一個''元素的例子（參見我的代碼中的'$ groupingHeaders.append'），你可以根據'colM odel'，列'emptyX'和根據哪些列當前具有'hidden：true'屬性。 – Oleg

jqGrid分組行重寫「間隔」列，我建立到我的網格

回答

相關問題