0

こんにちは、3 つのサブグリッドを持つ jqGrid を取得し、それらを水平方向に整列させることさえ可能かどうかを調べようとしています。このような：

==================================================
| | _ ___| | | |__ _ __| | | |__ _ __ _ ____ |

それぞれを左右にフロートするように設定しようとしましたが、重要に設定してもスタイルが上書きされます。どんな助けでも大歓迎です。

subGridRowExpanded: function(subGridDivId,rowId){
        $("#ClassGroupGrid").jqGrid('setSelection',rowId);
        var subgridClassTableId = subGridDivId + "_class_t";
        var subgridCreationTableID = subGridDivId + '_creation_t';
        var subgridConnectionTableID = subGridDivId + '_connection_t';

        $("#" + subGridDivId).html("<table style='float: left !important' id='" +      subgridClassTableId + "'></table>");
        $("#" + subgridClassTableId).jqGrid({
            datatype: 'local',
            data: classGroupData[parseInt(rowId) -1],
            colNames:['Classes'],
            colModel:[
                {name:'Classes', formatter: classGroupClassesFormatter}
            ],
            shrinkToFit: true
        });

        $('#' + subGridDivId).append("<table id='" + subgridCreationTableID + "'></table>");
        $("#" + subgridCreationTableID).jqGrid({
            datatype: 'local',
            data: classGroupData[parseInt(rowId) -1],
            colNames:['Creation Rules'],
            colModel:[
                {name:'Creation Rules', formatter: classGroupCreationFormatter}
            ],
            shrinkToFit: true
        });

        $('#' + subGridDivId).append("<table style='float: right !important' id='" + subgridConnectionTableID + "'></table>");
        $("#" + subgridConnectionTableID).jqGrid({
            datatype: 'local',
            data: classGroupData[parseInt(rowId) -1],
            colNames:['Connection Rules'],
            colModel:[
                {name:'Connection Rules', formatter: classGroupConnectionFormatter}
            ],
            shrinkToFit: true
        });
    }
4

2 に答える 2

1

jqGridが各テーブルを独自の内に配置しているようdivです。その場合、float: leftテーブルに置いてもあまり違いはありません。あなたはそれを含むdivに置く必要があります。これを試して：

$("#" + subGridDivId).css("float", "left");

ただし、生成されたHTMLを見ないと、それが正しい要素であるかどうかはわかりません。「黄金律」は、左にフロートする要素はすべてHTML内で互いに兄弟でなければならないというものです。

于 2012-05-30T21:24:06.783 に答える
0

ブリリアントのアイデアは近く、私を答えに導きました。サブグリッドの構造は次のとおりです。

<td role='row' class='ui-subgrid'>
<td role='row' class='ui-widget-content subgrid-cell'>
    <div class=tablediv>
        //divs containing subgrids

それらのいくつかを試した後、最終的に「ui-subgrid」として正しい親を見つけることができました。これを左にフロートさせてから、各サブグリッドを左にフロートさせると、わずかな警告を除いて、必要な答えが得られます。すべてのサブグリッドを含めることができるように、「ui-subgrid」の幅を設定する必要があります。したがって、これを行うためのcssは（少なくとも私が設定した方法です）：

.ui-subgrid{
float:left !important;
width: 1000px !important;
}

次に、subgridrowexpanded 関数で:

$('#gbox_' + subgridClassTableId).css("float", "left");

subgridclasstableid は、各サブグリッドの一意の ID です。

于 2012-05-31T16:19:17.873 に答える