0

Telerikグリッドを含むビューがあります。

Index.cshtml

@(Html.Telerik().Grid(Model)
.Name("Grid")
.DataKeys(keys => keys.Add(c => c.CustomerID))
.ToolBar(toolBar => toolBar.Template(
        @<text>
            <button id="feedback-open-button" title="Add Customer" class="t-button t-state-default">Add</button>
        </text>))
.Columns(columns =>
        {   
            columns.AutoGenerate(column =>
                {
                    //customize autogenereted column's settings
                    column.Width = "150px";                                                    
                    if (column.Member == "CustomerID")
                        column.Visible = false;
                });
            columns.Command(commands => commands
                .Custom("editCustomer")
                .Text("Edit")
                .DataRouteValues(route => route.Add(o => o.CustomerID).RouteKey("CustomerID"))
                .Ajax(true)
                .Action("EditCustomer", "Grid"))
            .HtmlAttributes(new { style = "text-align: center" })
            .Width(150);
        })    
)

ポップアップを使用して、このグリッドにレコードを追加/編集したいと思います。Telerikウィンドウを使用しました。このウィンドウでは、レコードを追加/編集するために部分ビューとして別のビューを開きました。これはウィンドウのコードであり、「ADD機能」のポップアップとしてウィンドウを開く方法です。

Index.cshtml

@{  Html.Telerik().Window()
    .Name("Window")
    .Title("Add / Edit Customer")        
    .Content(@<text>                 
                        @Html.Partial("AddEditCustomer", new Customer());
             </text>)
    .Width(400)
    .Draggable(true)
    .Modal(true)
    .Visible(false)
    .Render();
} 

@{ Html.Telerik().ScriptRegistrar()
    .OnDocumentReady(@<text>
        // open the initially hidden window when the button is clicked
        $('#feedback-open-button')
            .click(function(e) {
                e.preventDefault();
                $('#Window').data('tWindow').center().open();
            });           
                    </text>);
}

同じウィンドウを編集に使用しようとしました。しかし、ウィンドウ内の部分ビューに顧客オブジェクトを渡す際に問題が発生します。

CustomerController.cs

public JsonResult EditCustomer(int CustomerID)
{
    var model = CustomerModel._CustomerCollection.FirstOrDefault(o => o.CustomerID == CustomerID);

    return Json(new { customer = model });
}

Index.cshtml

<script type="text/javascript">
function onComplete(e) {
    if (e.name == "editCustomer") {
       var detailWindow = $("#Window").data("tWindow");       
       var customer = e.response.customer;                        
       detailWindow.center().open();
    } 
}
</script>

この「顧客」オブジェクトをポップアップウィンドウ内の部分ビューに渡すにはどうすればよいですか？

4

1 に答える 1

1

私が仕事をしているところでこれに対処する方法は、Telerikウィンドウに空のdivを作成することです。「編集」リンクは、ウィンドウのdivをターゲットとして使用するAJAXリンクです。リンクは選択したコントローラーメソッドを呼び出し、そこからJsonを返すのではなく、表示したいPartialViewを返すだけです。このアプローチの利点は、通常のビュー/部分の場合と同じように顧客オブジェクトを使用できることです。

AJAXが完了したら、Telerikウィンドウを開くと、コンテンツがそこに表示されます。

于 2012-06-07T17:23:36.920 に答える