4

jqGrid で編集フォームをカスタマイズして、提供されたテーブル構造レイアウトを使用する代わりに、フォーム要素に独自のカスタム CSS 構造レイアウトを使用したいと考えています。独自のカスタム ルックを使用できるようにするには、編集フォームをどのように変更すればよいですか?

4

5 に答える 5

6

jquery uiダイアログでこれを確実に達成できます。ただし、完全なコードを提供することはできませんが、実行する必要がある手順を支援します. 1 適用したい CSS とスタイルが何であれ、カスタム フォームをデザインします。これがカスタム フォームであるとします。

<div id="dialog-div">
    <input type="text">
</div>

2 jqueryダイアログでjqgrid editbuttonクリックでダイアログを開きます

$("#edit").click(function(){
            var rowdata = $("#coolGrid").jqGrid('getGridParam','selrow');
            if(rowdata){
                $("#dialog-div").dialog('open');
                var data = $("#coolGrid").jqGrid('getRowData',rowdata);
                alert(data);
            }
});

デフォルトでは、次のように閉じます-

$("#dialog-div").dialog({
            autoOpen: false,
});

変数にデータを取得したら、編集フォームに入力し、jquery ダイアログ ボタンをロジックに従って保存できます。これがお役に立てば幸いです。

于 2013-05-06T13:29:03.910 に答える
2

まず、置き換えたい部分を実装するフォーム編集モジュールのコードを読む（または少なくとも徹底的に調べる）ことをお勧めします。2000 行以上のコードで構成されていることがわかります。「～したい」と書くと、依頼内容を実現するための作業量がわかるはずです。コードを理解でき、jQuery UI などのライブラリを使用してもコードの変更を記述できる場合は、その作業に時間を費やす価値があるかどうかを判断できます。既存のソリューションを使用する主な利点は、時間を節約できることです。邪魔になるものは完璧ではありませんが、既存の製品を使用して独自のソリューションをすばやく作成できますそして許容できる品質で。無料で使用できる既存の製品を研究する方法は、車輪の再発明への多額の投資としてより効果的であるように思えます.

于 2013-05-03T14:55:24.273 に答える
0

ユーザーが編集ボタンをクリックすると、ページは別のページに移動し、ID に基づいて行の詳細を取得し、値を表示できます。

JQGridでリンクを作成するという以前の回答で問題が解決します。

于 2014-02-19T12:57:22.103 に答える
0

テーブル レイアウトに関する通常の問題は、列の幅が異なる場合、特に幅が非常に広い場合です。

beforeShowForm イベントの幅の広い列に attr colspan を追加して問題を解決しました。

例えば

"beforeShowForm":function() {
    $('#tr_fieldnameasinColModel > td.DataTD').attr('colspan',5);
}

派手ではありませんが、私にとってはうまくいきました。おそらく、同じことを行うよりエレガントな方法があります。フォームを余分に広げなくても、複数の列にフィールドを配置できました。

于 2013-07-07T21:08:44.643 に答える