2012-08-14 100 views
0

我有以下問題:我有一個自定義編輯命令的telerik mvc網格。這是網格的代碼:telerik mvc網格與ajax綁定

Html.Telerik().Grid<Customer>("customers") 
         .Name("Grid") 
         .DataKeys(k => k.Add(o => o.Id)) 
         .DataBinding(dataBinding => dataBinding.Ajax().Delete("Delete", "Customer").Select("AjaxIndex", "Customer")) 
         .Scrollable(builder => builder.Height(350)) 
         .Filterable() 
         .Sortable(s => s.OrderBy(order => order.Add(o => o.Id).Descending())) 
         .Columns(c => 
           { 
            c.Bound(o => o.Id); 
            c.Bound(o => o.FirstName); 
            c.Command(s => 
                { 
                 s.Custom("editCustomer") 
                  .Text("Edit") 
                  .Ajax(true) 
                  .Action("Edit", "Customer"); 
                  s.Delete().ButtonType(GridButtonType.Image);                            }).Width(175); 
           }) 
       .ClientEvents(builder => builder.OnComplete("onEditComplete")) 
        .Pageable(p => p.PageSize(5)) 
        .Selectable() 
        .Render(); 

這是回叫編輯命令的javascript函數:

function onAppraisalPhaseComplete(e) 
{ 
    if (e.name == "editCustomer") { 
     $("#dialog-form").html(e.response.PartialViewHtml); 
     open($("#dialog-form"), "Edit Customer"); // this will display a modal with the edit view 
    } 
} 

編輯形式是一個AJAX調用下面的方法:

public ActionResult JsonEdit(Customer customer) 
    { 
     if ((Rules.GetBrokenRules(customer).Count == 0))// there is no validation errors 
     { 
      Repository.Update(customer); 
     } 
     else 
     { 
      ModelState.AddModelErrors(Rules.GetBrokenRules(customer)); 
      return Json(new 
      { 
       Success = false, 
       PartialViewHtml = RenderPartialViewToString("Insert", appraisalPhaseViewModel) 
      }); 
     } 
//if save successful get the customers list and return the partial of the grid in Json 
     var customers= Repository.GetAll().ToList(); 
     ViewData["customers"] = customers; 

     return Json(new 
     { 
      Success = true, 
      PartialViewHtml = RenderPartialViewToString("MasterGrid") 
     }); 

上完整的AJAX調用如下:

function JsonSave_OnComplete(context) { 
     var jsonEdit = context.get_response().get_object(); 
     if (jsonEdit.Success) { // if the operation is successful reload grid and close the modal dialog 
      $("#MasterGridDiv").html(jsonEdit.PartialViewHtml); 
      CloseDialog($('#dialog-form')); 
     } else { //Redisplay the edit partial view in the modal 
      $("#dialog-form").html(jsonEdit.PartialViewHtml); 
     } 
    } 

編輯操作完成後,如果我嘗試按下刪除按鈕,它將調用JsonEdit操作而不是刪除操作。我不知道我在這裏做錯了什麼?另外,有時候刪除按鈕不起作用,而調用ajax綁定而不是刪除按鈕。

回答

2

您沒有爲按鈕提供完整的JavaScript處理程序,只是回調。我應該假設你做對了。但是,您的代碼存在明顯的問題。您嘗試通過從服務器端渲染的視圖注入html手動重新綁定telerik網格。 這可能會導致您的客戶端事件模型無法預料地蜂巢。 相反的:

$("#MasterGridDiv").html(jsonEdit.PartialViewHtml); 

嘗試使用:

$("#Grid").data("tGrid").rebind(); 
相關問題