web-dev-qa-db-fra.com

Kendo UI Grid après rendu ou après événement databound?

Existe-t-il un moyen de déclencher un événement après le rechargement de la grille via ajax?

je vois l'événement RequestEnd . mais cela semble se produire lorsque la demande est revenue, mais avant que la grille ne soit actualisée.

je vois aussi DataBound événement. mais cela se produit même plus tôt que RequestEnd,
également lorsque j'implémente un événement DataBound, mon en-tête disparaît.

j'ai dû recourir à ce hack

function requestEnd(o) {
    console.debug('request ended.', o);
    setTimeout(refreshEditable, 500); // enough time to render the grid
}
function refreshEditable() {
    // perform my actions on controls within grid content
}

comme une note latérale .. J'ai du mal à trouver une référence fiable pour l'API mvc de la grille de kendo. quand je le recherche sur Google, j'obtiens ceci: http://docs.telerik.com/kendo-ui/getting-started/using-kendo-with/aspnet-mvc/migration/widgets/grid qui est une collection de petits how-to et quelques "Events" mais ceux-ci ne correspondent pas à ce que je vois dans razor intelisense.

mise à jour : ajout d'une définition de databound

    $('#grid').kendoGrid({
        dataBound: function(e) {
            console.debug('data bound..');
        }
    });

et voici la définition de la grille ajax

   .Ajax().Read(read => read
        .Action("FilesRead", "SomeController")
        .Data("readData"))

 function readData() {
    return {
        IncludeChildren: $("#IncludeChildren").is(':checked'),
        SearchString: $('input[id=SearchString]').val()
    };
 }

je peux voir que DataBound est déclenché lors de l'appel ajax, pas après son retour.

mise à jour

corrigé le hook d'événement DataBound.

dans la fonction dataBound, j'essaie d'obtenir une référence aux nouveaux modèles rendus ..

function dataBound(o) {
  console.debug($('span.editable').length);                    // returns 0 
  setTimeout("console.debug($('span.editable').length)", 500); // returns 4
}

les portées sont ajoutées à l'aide d'un modèle client

.ClientTemplate(@"<span class=""editable"" ... >#=DOCUMENT_DATE_FORMATTED#</span>");

tu vois ce que je veux dire? la liaison des données se produit avant le rendu de la grille

javascriptkendo-uitelerikkendo-gridtelerik-grid
23
Sonic Soul

Voir cet exemple de code extrait de la documentation (les documents API sur les événements sont ici ) sur la façon de lier un gestionnaire d'événements à l'aide de wrappers MVC:

@(Html.Kendo().Grid(Model)
      .Name("grid")
      .Events(e => e
          .DataBound("grid_dataBound")
          .Change("grid_change")
      )
)
<script>
function grid_dataBound() {
    //Handle the dataBound event
}

function grid_change() {
    //Handle the change event
}
</script>

Si vous souhaitez lier un gestionnaire en JavaScript, vous devez accéder à la grille comme ceci:

var grid = $("#grid").data("kendoGrid");
grid.bind("dataBound", function(e) {});

Lorsque vous faites cela ici:

$('#grid').kendoGrid({
    dataBound: function(e) {
        console.debug('data bound..');
    }
});

vous créez en fait une nouvelle instance de grille.

11
Lars Höppner

vous pouvez utiliser de cette façon:

 transport: {
           read: {
           url: searchUrl,
           type: "POST",
           dataType: "json",
           data: additionalData,
           complete: function () {
              //code here :)
           }
        },                   
     },
0
Vĩnh Phú Ngô