2

私はMVCとKendoUIの両方に不慣れであり、まだ何が可能かを理解しようとしているので、愚かな質問を許してください。

ページの上半分にグリッドがあり、下半分にタブ付きパネルがあるページレイアウトがあります。ユーザーがグリッド上のレコードの1つを選択したときに、コントローラーを呼び出してデータベース呼び出しを行い、タブ付きパネルに詳細を入力できるようにします。

現在、選択した行のIDを取得できます...しかし、JavaScriptからコントローラーを呼び出して、タブ付きパネルだけを更新するにはどうすればよいのでしょうか。$ .ajaxについて少し読みましたが、コントローラーを呼び出して、必要な詳細情報が入力された部分ビュー(タブ付きパネル)を返すことはできますか?

グリッド内のカスタム詳細テンプレート内にPanelをロードすることを試みましたが、そのアイデアは意思決定者が肩をすくめることによって投げ出されました。これは可能ですか?

4

1 に答える 1

0

これは間違いなく可能です。ただし、jQueryに精通する必要があります。剣道グリッドのイベントを扱っているようですので、ここでは取り上げません。これがトリック(の1つ)です...

この場合、剣道グリッドは、新しい州(つまり、TX、NY)が選択されるたびに、この関数を呼び出すグリッドでイベントが発生する、派手な複数選択として使用されています。これはあなたが求めていた以上のものなので、説明します。これを行っています:

  1. グリッドで複数選択されたアイテムのリストを追加し、このリストを非表示のフォームフィールドに割り当てます。
  2. Ajax postを使用して、フォーム内のこの情報とその他の情報でデータベースを更新します(フォーム全体が渡されます)。2b。'async:false'に注意してください。これにより、次のAjax呼び出しの前にデータベースが更新されます。
  3. すべてのフォームフィールドを使用してデータベースを再度クエリする別のAjax投稿。

両方のAjax呼び出しは、データベースと通信し、部分的なビューを返すMVCコントローラーメソッドにアクセスして、ページの2つの別々の部分を一度に更新します。これらは何でもかまいません。この場合、両方とも追加の剣道グリッドですが、タブ付きパネルも同様に簡単です。

function updateParts() {
    var grid = $('#States').data('kendoGrid');
    var rows = grid.select();
    $('#StatesQuery').val('');
    rows.each(
        function () {
            var record = grid.dataItem($(this));
            $('#StatesQuery').val($('#StatesQuery').val() + record.StateCode + ",");
        }
    );
    $.ajax({
        url: '@Url.Action("UpdateSomething", "Controller")',
        type: 'post',
        data: $('form#ajaxSearchForm').serialize(),
        async: false,
        success: function (result) {
            $('#SomethingElseDiv').html(result);
        }
    });
    $.ajax({
        url: '@Url.Action("QuerySomething", "Controller")',
        type: 'post',
        data: $('form#ajaxSearchForm').serialize(),
        success: function (result) {
            $('#SearchResultsDiv').html(result);
        }
    });
}

コントローラ方式

[HttpPost]
public ActionResult QuerySomthing(FormCollection formCollection)
{
    var query = new Status(); // Complext Data Model for Search
    query.States = formCollection["StatesQuery"].Split(',');
    ... etc
    var model = new SearchViewModel(); // ViewModel for Partial
    model.StatusSummaries = _submissionsDataProvider.DoQuery(query);
    return View("SearchResults", model);
}

私と同じように剣道とMVCを楽しんでいただければ幸いです。

于 2013-02-02T01:14:53.770 に答える