2017-08-22 1 views
0

J'essaie d'utiliser des éditeurs personnalisés pour une grille ui kendo modifiable dans mon application angulaire. Pour une raison quelconque (que je ne suis pas en mesure de tracer), l'éditeur personnalisé n'est pas déclenché.Utilisation d'éditeurs personnalisés dans la colonne de la grille avec l'interface utilisateur angulaire Kendo

Je m'attends à ce que les éléments suivants soient déclenchés mais cela ne fonctionne pas.

console.log("Editor Launched", options); 

Voici le plunker pour le même: http://plnkr.co/edit/WioRbXA3LHVVRQD95nXA?p=preview

app.controller('MainCtrl', function($scope) { 
$scope.model = {}; 
$scope.model.dataSource = new kendo.data.DataSource({ 
    data: createRandomData(10), 
    schema: { 
     model: { 
      fields: { 
       City: { type: "string" }, 
       Title: { type: "string" }, 
       BirthDate: { type: "date" }, 
       Age: { type: "number" } 
      } 
     } 
    }, 
    pageSize: 16, 
    editable:true 
}); 

$scope.addWWNumEditor= function (container, options) { 
    console.log("Editor Launched", options); 
    $('<input kendo-numeric-text-box k-min="10" k-max="20" style="width: 100%;" data-bind="value:' + options.field + '"/>') 
    .appendTo(container); 
} 



$scope.controlIsDisabled=function(model){ 
//console.log("model",(model.Age>=50)); 
var toReturn = (model.Age>50)?"columnDisabled" : "columnActive"; 
//console.log('to Return',toReturn); 
return toReturn; 
} 

$scope.model.columns = [ 
    { field: 'City', title: 'City' }, 
    { 
     field: 'Title', 
     title: 'Title', 
     template:'<span style="color:red;">EDITABLE</span><span ng- 
     class="controlIsDisabled(dataItem)">#=Title#</span>' 
    }, 
    { 
     field: 'Age', 
     title: 'Age', 
     template:'<span ng-class="controlIsDisabled(dataItem)">#=Age#</span>' 
    , 
     editor:$scope.addWWNumEditor 
    } 
]; 

}); 

Répondre

0

En supposant que votre miroir Plunkr votre code actuel, le principal problème que je vois est dans votre liaison de k-columns sur l'élément de grille. Vous avez actuellement k-columns="{{model.columns}}", mais les {{}} sont inutiles ici. Passer à k-columns="model.columns" provoque l'exécution de la fonction de l'éditeur comme prévu.