2

システム管理者が属性のマスターリストからデバイス属性の順序付きリストを生成し、それを指定された構成として保存できるようにする必要があるMVC3アプリケーションがあります。

私は次の質問と回答を見てきました-JQueryを使用したドラッグアンドドロップの実装

JQuery UIの並べ替え可能なライブラリ、スクリプト、スタイルをビューに含めましたが、視覚的にはすべてがうまく機能しているようです。Ityemsは、マスターから出力リストにドラッグアンドドロップされます。

私の問題は、出力リスト（並べ替え可能なJQuery UI要素）からデータを取得することです。参照されている記事では、sortable要素でserializeメソッドを使用することを推奨しています。ただし、sortableは、フォームの入力要素のクエリ文字列を返すように見えるだけです。私の場合のソート可能な要素は順序付きリストであり、そのデータは参照されていません。

ソート可能な要素のデータをコントローラーに戻すにはどうすればよいですか？

ありがとう。

4

1 に答える 1

1

jQuery UI のserializeメソッドは、要素の ID を調べて、コントローラーへのポストバックに適したシリアル化されたハッシュ文字列を作成します。デフォルトでは、ID は次のいずれかの形式である必要があります。

<li id="setname=number"></li>
<li id="setname-number"></li>
<li id="setname_number"></li>

これらはすべて、次の結果になります。

"setname[]=number&setname[]=number"

serialize メソッドが空の文字列を返す場合は、ソート可能な要素を正しくターゲットにしていないか、sortable() 呼び出しでまだ初期化されていないか、ID の形式が正しくありません。カスタムの「キー」、「属性」、および「式」パラメーターを serialize メソッドに渡すことで、jQuery UI が要素をシリアル化する方法を変更できることに注意してください。

var sortedList = $('ul.sortableList').sortable('serialize', { attribute: 'itemid', key: 'foo[]', expression: /(.+)=(.+)/ });

もちろん、いつでも独自のシリアル化メソッドをロールして、更新された LI 位置をコントローラーに手動で渡すことができます。

var positions = new Array();

$sortableLis.each(function () {

    var sortableId = $(this).find('input[id$=SortableID]').val();
    var sortOrder = $sortableLis.index($(this));

    var SortablePosition = {
        ID: encodeURIComponent(sortableId),
        SortOrder: sortOrder
    };

    positions.push(SortablePosition);

});

$.ajax({
    type: 'POST',
    url: '/UpdateSortablePositions',
    data: "{ positions: '" + $.toJSON(positions) + "' }",
    contentType: 'application/json; charset=utf-8',
    dataType: 'json'
});
于 2012-07-31T18:08:50.777 に答える