自定義命令按鈕並沒有更新局部視圖

Index.cshtml：在我的HomeController

@using Kendo.Mvc.UI 
@model IEnumerable<KendoUIMvcApplication3.Models.Product> 
@{ 
    ViewBag.Title = "Home Page"; 
} 
<script type="text/javascript"> 
    function clickView(e) { 
     e.preventDefault(); 
     var dataItem = this.dataItem($(e.currentTarget).closest("tr")); 
     $.ajax({ 
      url: "/Home/ViewDetails", 
      data: { productId: dataItem.Id } 
     }); 
    } 
</script> 
<div> 
    @(Html.Kendo().Grid(Model) 
      .Name("RoleGrid") 
      .Columns(columns => 
       { 
        columns.Bound(p => p.Id); 
        columns.Bound(p => p.Name).Width("30%"); 
        columns.Bound(p => p.Description); 
        columns.Command(command => 
         { 
          command.Edit(); 
          command.Destroy(); 
          command.Custom("View").Click("clickView"); 
         }).Width(250); 
       }) 
      .ToolBar(toolbar => toolbar.Create().Text("Add")) 
      .Sortable() 
      .Scrollable() 
      .HtmlAttributes(new { style = "height: 350px" }) 
</div> 

@{ Html.RenderAction("ViewDetails", "Home", new { productId = 0 });}

ViewDetails行動：

public ActionResult ViewDetails(int productId) 
{ 
    Detail model; 
    if (productId == 0) 
    { 
     model = new Detail 
      { 
       Price = "zero", 
       Origin = "zero" 
      }; 
    } else { 
     model = new Detail 
      { 
       Price = productId.ToString(), 
       Origin = productId.ToString() 
      }; 
    } 
    return View(model); 
}

ViewDetails.cshtml：

@model KendoUIMvcApplication3.Models.Detail 
@{ 
    ViewBag.Title = "ViewDetails"; 
    Layout = null; 
} 

@Html.DisplayFor(m => m.Price) 
@Html.DisplayFor(m => m.Origin)

一切正常。

點擊自定義的「查看」按鈕會關閉javascript，這會對我的ViewDetails操作產生ajax調用。 productId值正確傳遞，但是，我的ViewDetails操作的return(model)根本沒有更新我的視圖頁面。

我的index.cshtml中不應該使用RenderAction嗎？

來源

2012-12-12 Null Reference

要顯示網格下的任何按鈕被點擊時的部分視圖，您應該使用成功 $ .ajax的回調函數。

@using Kendo.Mvc.UI 
@model IEnumerable<KendoUIMvcApplication3.Models.Product> 
@{ 
    ViewBag.Title = "Home Page"; 
} 
<script type="text/javascript"> 
    function clickView(e) { 
     e.preventDefault(); 
     var dataItem = this.dataItem($(e.currentTarget).closest("tr")); 
     $.ajax({ 
      url: "/Home/ViewDetails", 
      data: { productId: dataItem.Id }, 
      success:function(response){ 
       $('#viewDetails').html(response); 
      } 
     }); 
    } 
</script> 
<div> 
    @(Html.Kendo().Grid(Model) 
      .Name("RoleGrid") 
      .Columns(columns => 
       { 
        columns.Bound(p => p.Id); 
        columns.Bound(p => p.Name).Width("30%"); 
        columns.Bound(p => p.Description); 
        columns.Command(command => 
         { 
          command.Edit(); 
          command.Destroy(); 
          command.Custom("View").Click("clickView"); 
         }).Width(250); 
       }) 
      .ToolBar(toolbar => toolbar.Create().Text("Add")) 
      .Sortable() 
      .Scrollable() 
      .HtmlAttributes(new { style = "height: 350px" }) 
</div> 

<div id="viewDetails"></div>

來源

2012-12-12 20:30:21

自定義命令按鈕並沒有更新局部視圖

回答

相關問題