3

データが ajax 呼び出しで読み込まれる剣道ウィンドウがあります。この剣道ウィンドウはウィジェット エディターのように機能し、ユーザーはデータを変更または操作してさまざまなチャートなどをレンダリングできます。ユーザーがすべてのオプションを設定したら、ページに表示する前にチャート/グラフをプレビューしたいと考えています。モデル ウィンドウを正常に構築し、1 つの入力 (プレビュー) ボタンで初期データをロードしましたが、プレビュー ボタンのクリックでモデル ウィンドウ内の部分ビューをロードする方法がわかりません。このアプローチが正しいかどうかはわかりませんが、チャート/グラフをレンダリングするためにこの部分ビューに渡されるモデルを構築する必要があるため、部分ビューが必要です。

    $('.btnedit').click(function () {
        var pwrid = $(this)[0].id;

        $.ajax({
            url: '/Home/EditWidget/' + '?id=' + pwrid,
            type: 'GET',
            accepts: 'text/html',
            context: self,
            success: self.editWidgetWindowCallBack,
            error: function () { alert('Oops! Something went wrong'); },
            complete: function(){ }
        });
    });

editWidgetWindowCallBack: function (html, textStatus, jqXHR) {
    var model = $('#EditWidgetModelWindow').data('kendoWindow');
    model.content(html);
    model.center();
    model.open();
}

EditWidgetModelWindow は私の剣道モデル ウィンドウです。

以下は私のアクションメソッドです

public ActionResult EditWidget(string id)
{
    var widgetViewModel = // view model construction here.
    return PartialView("Widgets/_EditWidget", widgetViewModel);
}

これは、私の剣道モデル ウィンドウがエディタの部分ビューをロードする方法であり、ボタン クリックでこの部分ビュー内に別の部分ビューをロードしたいと考えています。たとえば、部分ビュー名が _Chart でモデル名が ChartModel の場合、ボタン クリック (オンデマンド) で親部分ビューからこの部分ビューを呼び出し、剣道モデル ウィンドウで既存の部分ビュー内にレンダリングする方法。

4

1 に答える 1

4

このアプローチを使用して、html を剣道ウィンドウにロードします。

  1. を返す MVC アクションPartialViewResult
  2. jQueryloadメソッドを使用して、ポイント 1 から html を取得します
  3. Ajax呼び出しでエラーがなければ剣道ウィンドウを開く

あなたのMVCコードはこれです

public ActionResult EditWidget(string id)
{
    var widgetViewModel = // view model construction here.
    return PartialView("Widgets/_EditWidget", widgetViewModel);
}

剣道ウィンドウを保持する html マークアップを定義します。

@(Html.Kendo().Window()
    .Name("wndWindow")  
    .Content(@<text>
         <div id="wndContent">

    </div>
   </text>)

) )

スクリプトでは、jQuery を使用して html を取得します。

$('.btnedit').click(function () {
   var pwrid = $(this)[0].id;

   $('#wndContent').load('/Home/EditWidget/', {id: prwid}, function (response, status, xhr) {
            if (status == "error"){
                try{
                    var msge = $.parseJSON(response);
                    // get the server error
                } catch(e){
                    alert("Error parsing server response");
                }
            }else{
                $("#wndWindow").data("kendoWindow").open().center();
            });
于 2015-09-28T10:32:52.287 に答える