2014-11-03 74 views
0

我有一個kendo網格有數據通過AJAX填充。Kendo UI網格彈出AJAX數據後現在工作

如果我拿出AJAX一切都很好,但是當我通過AJAX填充數據時,編輯按鈕不會彈出。

網格本身看起來是這樣的:

<div id="DefinedLevelsGridContainer"> 
@(Html.Kendo().Grid(Model.Where(x => x.OrgLevel == 0).First().DefinedFieldsList) 
    .Name("DefinedlevelsGrid") 
    .Columns(columns => 
    { 
     columns.Bound(x => x.FieldName).Title("Name"); 
     columns.Bound(x => x.FieldTypeText).Title("Type"); 
     columns.Bound(x => x.isMandatory).Title("Mandatory"); 
     columns.Bound(x => x.DefaultValue).Title("Default Value"); 
     columns.Bound(x => x.UpdatedOn).Title("Updated"); 
     columns.Command(command => { command.Edit(); command.Destroy(); }); 
    }) 
    .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("_OrgDefinedFieldEdit")) 
    .Pageable() 
    .Sortable() 
    .DataSource(dataSource => dataSource 
    .Server() 
    .Model(model => model.Id(x => x.FieldId)) 
    .Update(update => update.Action("Update", "Home")) 
    .Destroy(destroy => destroy.Action("Destroy", "Home")) 
    ) 
) 

正如你可以看到我填充它,默認情況下,與第一項數據的列表。

然後我有這樣的:

$(window).load(function() { 
    $(".LevelSelector:first").click(); 
}); 

它調用下面的函數:

$(".LevelSelector").click(function() { 
     var rootString = $(this).html(); 
     var splitString = rootString.split("-"); 
     var levelGuid = $(this).attr("LevelGuid").toString(); 

     $("#LevelEditName").text($.trim(splitString[0])); 
     $("#LevelEditInput").val($.trim(splitString[1])); 
     $("#CreatedOn").text($(this).attr("CreatedDate")) 
     $("#CreatedBy").text($(this).attr("CreatedBy")) 
     $("#UpdatedOn").text($(this).attr("UpdatedDate")) 
     $("#SelectedLevelGuid").text(levelGuid) 

     var Url = '@Url.Action("GetLevelFields", "OrganisationAJAX")' + '?LevelGuid=' + levelGuid; 

     $.ajax({ 
      url: Url, 
      contentType: "application/json; charset=utf-8", 
      type: 'POST', 
      context: this, 
      timeout: 60000, 
      dataType: 'json', 
      tryCount: 0, 
      retryLimit: 3, 
      success: function (data) { 

       var grid = $("#DefinedlevelsGrid").data("kendoGrid"); 
       grid.dataSource.data(data); 
      }, 
      error: function (httpRequest, textStatus, errorThrown) { 
       $(".Message").text("Error: " + textStatus + " " + errorThrown); 
      } 
     }); 
    }); 

第一部分填充的頁面的另一部分,然後它一個AJAX調用去弄數據。成功後,它會填充網格。

這一切都有效。

但是當我點擊編輯它不加載網格。它確實移動到頁面的頂部,所以我知道它正在發射。

如果我通過AJAX停止前人羣,它會加載模板,所以我知道該模板沒有錯。

有沒有人有任何想法?

非常感謝提前。

回答

1

在vcase的任何人看到這個,我通過將.Server更改爲.Ajax來修復它。

因此,這將是這樣的:

@(Html.Kendo().Grid(Model.Where(x => x.OrgLevel == 0).First().DefinedFieldsList) 
.Name("DefinedlevelsGrid") 
.Columns(columns => 
{ 
    columns.Bound(x => x.FieldName).Title("Name"); 
    columns.Bound(x => x.FieldTypeText).Title("Type"); 
    columns.Bound(x => x.isMandatory).Title("Mandatory"); 
    columns.Bound(x => x.DefaultValue).Title("Default Value"); 
    columns.Bound(x => x.UpdatedOn).Title("Updated"); 
    columns.Command(command => { command.Edit(); command.Destroy(); }); 
}) 
.Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("_OrgDefinedFieldEdit")) 
.Pageable() 
.Sortable() 
.DataSource(dataSource => dataSource 
.Ajax() //<------- Changed to .Ajax() 
.Model(model => model.Id(x => x.FieldId)) 
.Update(update => update.Action("Update", "Home")) 
.Destroy(destroy => destroy.Action("Destroy", "Home")) 
)