kendo ui Rasterspaltenvorlage wird nicht angewendet

Gefolgt von ersten Schritten Dokumentation zum Einrichten eines Basisrasters. Ich habe eine Spaltenvorlage hinzugefügt, um die erste Spalte fett zu formatieren, sie wird jedoch nicht angewendet. Ich habe den Code im Dojo ausprobiert und es funktioniert. Triple überprüft die Syntax, gird wird mit allen Daten in Ordnung angezeigt, aber kein Fett wird angewendet.kendo ui Rasterspaltenvorlage wird nicht angewendet

Überprüfung des HTML in Chrome zeigte keinen Stil auf die Tabellendaten angewendet.

Dies muss etwas wirklich einfach sein, ich bin mit Blick auf ...

hier ist der Code:

<!DOCTYPE html> 
 

 
<html> 
 
<head runat="server"> 
 
    <title>Client</title> 
 
    
 
<!-- Common Kendo UI CSS for web widgets and widgets for data visualization. --> 
 
    <link href="../css/kendo/kendo.common.min.css" rel="stylesheet" /> 
 
    <!-- (Optional) RTL CSS for Kendo UI widgets for the web. Include only in right-to-left applications. --> 
 
    <%--<link href="../css/kendo/kendo.rtl.min.css" rel="stylesheet" type="text/css" />--%> 
 
    <!-- Default Kendo UI theme CSS for web widgets and widgets for data visualization. --> 
 
    <link href="../css/kendo/kendo.default.min.css" rel="stylesheet" /> 
 
    <!-- (Optional) Kendo UI Hybrid CSS. Include only if you will use the mobile devices features. --> 
 
    <link href="../css/kendo/kendo.default.mobile.min.css" rel="stylesheet" type="text/css" /> 
 
    <!-- Kendo UI combined JavaScript --> 
 
    <script src="../js/kendo/kendo.all.min.js"></script> 
 
    
 
    <script> 
 

 
     var people = [ 
 
       { firstName: "John", 
 
        lastName: "Smith", 
 
        email: "[email protected]" 
 
       }, 
 
       { firstName: "Jane", 
 
        lastName: "Smith", 
 
        email: "[email protected]" 
 
       }, 
 
       { firstName: "Josh", 
 
        lastName: "Davis", 
 
        email: "[email protected]" 
 
       }, 
 
       { firstName: "Cindy", 
 
        lastName: "Jones", 
 
        email: "[email protected]" 
 
       } 
 
     ]; 
 

 

 
     $("#client_grid").kendoGrid({ 
 
      autoBind: false, 
 
      selectable: true, 
 
      columns: [{ 
 
       field: "firstName", 
 
       title: "First Name", 
 
       template: "<strong>#: firstName # </strong>" 
 
      }, 
 
      { 
 
       field: "lastName", 
 
       title: "Last Name", 
 
      }, 
 
      { 
 
       field: "email", 
 
       title: "Email", 
 
      }] 
 
     }); 
 

 

 
     $("#client_grid").kendoGrid({ 
 
      dataSource: people 
 
     }); 
 

 
         
 
    </script> 
 

 

 
</head> 
 
<body> 
 

 
<div id="client_grid" /> 
 

 

 
</body> 
 
</html>

Quelle

2016-12-15 kpg

Nun, basierend auf dem Code, den Sie zur Verfügung gestellt, Sie initialisieren das Raster zweimal:

Eins:

$("#client_grid").kendoGrid({ 
     autoBind: false, 
     selectable: true, 
     columns: [{ 
      field: "firstName", 
      title: "First Name", 
      template: "<strong>#: firstName # </strong>" 
     }, 
     { 
      field: "lastName", 
      title: "Last Name", 
     }, 
     { 
      field: "email", 
      title: "Email", 
     }] 
    });

Zwei:

$("#client_grid").kendoGrid({ 
     dataSource: people 
    });

Und das zweite ist bläst Ihre Konfiguration des ersten (einschließlich der Vorlage) entfernt.

tun Gerade diese statt:

$("#client_grid").kendoGrid({ 
     dataSource: people, 
     autoBind: false, 
     selectable: true, 
     columns: [{ 
      field: "firstName", 
      title: "First Name", 
      template: "<strong>#: firstName # </strong>" 
     }, 
     { 
      field: "lastName", 
      title: "Last Name", 
     }, 
     { 
      field: "email", 
      title: "Email", 
     }] 
    }); 
// Because autobind is false, you have to trigger the fetch somehow... 
$("#client_grid").getKendoGrid().dataSource.read();

Demo: http://dojo.telerik.com/@Stephen/UPuga

Quelle

2016-12-15 22:03:18

Dies funktioniert, aber es erfordert Datasource (!) Menschen in der Initialisierung deklariert werden ... meine Absicht zu entfernten Daten zu binden durch einen Ajax-Aufruf erhalten, so dass die Datenquelle nicht im Voraus bekannt ist. Ich sehe, dass die doppelte Initialisierung das Problem ist, also wie kann dies eingerichtet werden, um in diesem Fall zu arbeiten? – kpg

OK, ich sehe, dass die Datenquelle ein Transportkonstrukt für den Remote-Datenzugriff benötigt ... Ich habe versucht, dies (falsch) mit dem obigen Code zu simulieren und das Raster neu zu initialisieren. Vielen Dank! – kpg

Es gibt auch die Methode setDataSource(): http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#methods-setDataSource –

kendo ui Rasterspaltenvorlage wird nicht angewendet

Antwort

Verwandte Themen