Kendo Gitter, Änderungstext auf Schaltfläche Bearbeiten

ich ein Kendo-Gitter haben, die ein bisschen wie folgt (Code für Klarheit bearbeitet) aussieht:Kendo Gitter, Änderungstext auf Schaltfläche Bearbeiten

var gridList = $('##listBo').kendoGrid({ 

     ... 

     columns: [ 
      ... 
      { 
       command: "edit" 
       , title: 'Edit' // Need to make this text conditional 
       , width: 91 
      } 
     ] 

     ... 

     , editable: { 
       mode: "popup" 
       , template: $("##addEditPopup").html() 
       , window: { 
       open: loadJSOnWindowLaunch 
       , title: "Reservation request" 
      } 
      } 
     , dataBound: function(e) { 
      dataBoundFunction(); 
     } 

    }).data("kendoGrid");

Ich brauche die Taste, um sagen zu lassen, ‚Bearbeiten‘ unter bestimmten Umständen und 'View' in anderen, basierend auf Werten in der Datenquelle.

Wie mache ich das am besten?

Quelle

2016-11-11 Junglefish

Ein einfacher Ansatz, um mit dieser Situation umzugehen, besteht darin, eine benutzerdefinierte Befehlsspalte zu erstellen und dann die Vorlagenoption zu verwenden, um die Spaltenschaltfläche entsprechend Ihrer Bedingung darzustellen.

Versuchen wie folgt aus:

$("#grid").kendoGrid({ 
        dataSource: dataSource, 
        pageable: true, 
        height: 550, 
        toolbar: ["create"], 
        columns: [ 
         { field:"ProductName", title: "Product Name" }, 
         { field: "UnitPrice", title:"Unit Price", format: "{0:c}", width: "120px" }, 
         { field: "UnitsInStock", title:"Units In Stock", width: "120px" }, 
         { field: "Discontinued", width: "120px" }, 
         { template: comandTemplate }], 
        editable: "popup" 
       }); 
      }); 
      // render command column button based on condition 
      function comandTemplate(model){ 
       // here i use Discontinued attribute to data model to show 
       // view detail button or edit button 
       if(model.Discontinued==0) 
       { 
        return '<a class="k-button k-button-icontext k-grid-edit" href="#"><span class="k-icon k-edit"></span>Edit</a>'; 
       } 
       else 
       { 
        return '<a class="k-button k-button-icontext" href="javascript:void(0)" onclick="viewDetailsAction()">View Details</a>'; 
       } 
      } 
      // Custom action if view detail button click 
      function viewDetailsAction() 
      { 
       alert("Your custom action for view detail"); 
      }

Hier ist ein funktionierendes Beispiel http://dojo.telerik.com/AdAKO

Ich hoffe, es wird Ihnen helfen.

Quelle

2016-11-15 07:34:04

Haben Sie meine Lösung versucht? Ist es das, was du willst? –

Hallo. Ich habe etwas Ähnliches versucht, bevor ich die Frage hier gestellt habe. Das Problem, das ich hatte, ist, dass, wenn Sie in meinen ursprünglichen Code schauen, wenn die Schaltfläche 'Bearbeiten' gedrückt wird, ich alle Objekte benötigen muss, die im 'bearbeitbaren' Knoten ausgeführt werden (zB ein Popup starten, eine JS-Funktion ausführen) , etc). Wie kann ich Ihre Lösung verwenden und diese Dinge trotzdem ausführen? – Junglefish

Hallo Michael, Wenn Sie die Demo überprüfen, die ich erstellt habe, können Sie das Popup-Fenster sehr gut bearbeiten sehen. Und wenn Sie irgendeine Funktion auf Ereignis ausführen möchten, können Sie wie gewohnt. Lassen Sie mich wissen, welche Funktion Sie bei welchem Ereignis ausführen möchten. –

Sie müssen nur benutzerdefinierte Spalte in Spalten wie dieser

{ 
    template: "# if (property == true) { # <a class="k-button k-grid-edit" 
    href="#"><span class="k-icon k-edit"></span>Edit</a> # } else { # 
    <a class="k-button"><span onClick="callFunction()" 
    </span>View</a> # } #", width: "150px" 
}

hinzufügen, wo „Eigentum“ ist ein Feld, das die Verwendung als Bedingungsfeld werden verschiedene Schaltflächen angezeigt werden soll.

Hoffe, dies wird für Sie arbeiten. (ThumbsUp)

Quelle

2016-11-18 12:36:54 Punit

Kendo Gitter, Änderungstext auf Schaltfläche Bearbeiten

Antwort

Verwandte Themen