jqgrid中如何将一个单元格分成2个？

可以通过 jqgrid 获得此类设计

   ------------------------------- ----------
   | S.N0 | order ID   |   Date  |   Amount |
            ---------    -------
   |      | Location   |   Status|          |
    ------------------------------ ---------
   |   1  |  45        |  1/1/11 |  100     |
            ---------    -------- 
   |      |  E123      |   Done  |          |
    ------------------------------ ----------

在 2X2（第二列，第二行）中，我需要显示订单 ID 和位置。位置值应显示在订单 ID 下。有可能吗？

对于该列，您可以定义一个自定义格式化程序，您可以将其应用到您喜欢的任何样式。在该格式化程序中，您可以访问该行中所有对象的值。因此，对于您的订单/位置格式化程序，您可以将两者结合起来，如下所示：

function orderFmatter( cellvalue, options, rowObject )
{
    return "<div>" + cellvalue + "</div><hr /><div>" 
               + rowObject.Location + "</div>";
}

您可能想要向这些 div 添加类，以便可以更好地设计它来满足您的需求。就您的列定义而言，您需要在其中一列上声明 customFormatter (注意：它的声明将是上面函数中的变量 cellvalue），则需要隐藏另一列，因为它需要作为 rowObject 的一部分。前任。

{
    name: 'OrderID',
    index: 'OrderID',
    width: 90,
    formatter:orderFmatter},
{
    name: 'Location',
    index: 'Location',
    hidden: true},

这是我的完整示例：

$("#grid").jqGrid({
    datatype: "local",
    height: 250,
    colNames: ["SNO", "OrderID", "Location", "Date", "Status", "Amount"],
    colModel: [{
        name: 'SNO',
        index: 'SNO',
        width: 60},
    {
        name: 'OrderID',
        index: 'OrderID',
        width: 90,
        formatter:orderFmatter},
    {
        name: 'Location',
        index: 'Location',
        hidden: true},
    {
        name: 'Date',
        index: 'Date',
        width: 80,
        formatter:dateStatusFmatter},
    {
        name: 'Status',
        index: 'Status',
        width: 80,
        hidden: true},
    {
        name: 'Amount',
        index: 'Amount',
        width: 80}
    ],
    caption: "Stack Overflow Example",
});

function orderFmatter( cellvalue, options, rowObject )
{
    return "<div>" + cellvalue + "</div><hr /><div>" + rowObject.Location + "</div>";
}

function dateStatusFmatter( cellvalue, options, rowObject )
{
    return "<div>" + cellvalue + "</div><hr /><div>" + rowObject.Status+ "</div>";
}

小提琴也可用here http://jsfiddle.net/fbfcn/5yqRn/1/.

这只留下了你的标题，这有点困难并且可能会变得丑陋。我建议不要在标题上进行分割级别并执行类似的操作Order Id/Location。 可以通过这样做来设置：

jQuery("#grid").jqGrid('setLabel', 'OrderID', 'Order Id/Location');

就像在这个fiddle http://jsfiddle.net/fbfcn/5yqRn/2/.

如果您绝对必须像示例中那样设置标题，我可以看看我能弄清楚什么，但这应该可以帮助您开始。