2016-07-04 12 views
1

Ich versuche, kollabierbare Daten in einer Zelle von Kendo UI Grid anzuzeigen. In meinem Kendo Raster gibt es eine Spalte als Preise & pro Zeile, es kann mehrere Werte für diese Preisspalte geben. Um alle Preise innerhalb der bestimmten Zelle anzuzeigen, habe ich unter Vorlage versucht.Kendo-Grid: Anzeige kollabierbarer Daten in Grid-Zellen

template : "<button type='button' class='btn btn-info' data-toggle='collapse' data-target='#demo'>Price</button>" 
      + "<div id='demo' class='collapse'>" 
      + "<ul>" 
      + "#if (competitorPrice!=null){#" 
      + " #for (var i=0,len=competitorPrice.length; i<len; i++){#" 
      + " <li><b>#:competitorPrice[i].competitorName #:</b> #: kendo.toString(competitorPrice[i].price, 'n2') #</li>" 
      + "# } #" 
      + "#}#" 
      + "</ul>" 
      + "</div>" 

Ich möchte nur Daten in Rasterzellen zusammenfassen. Ich verwende bootstrap3 & angularjs.

Der obige Code gibt mir folgende Fehlermeldung in der Konsole.

angular.js:9778 Error: Invalid template:'<tr data-uid="#=data.uid#" role='row'><td role='gridcell'>#= kendo.toString(kendo.parseDate(date, 'yyyy-MM-dd'), 'dd-MM-yyyy') #</td><td role='gridcell'>#:data.salesCount==null?'':data.salesCount#</td><td role='gridcell'><button type='button' class='btn btn-info' data-toggle='collapse' data-target='#demo'></button><div id='demo' class='collapse'><ul>#if (competitorPrice!=null){# #for (var i=0,len=competitorPrice.length; i<len; i++){# <li><b>#:competitorPrice[i].competitorName #:</b> #: kendo.toString(competitorPrice[i].price, 'n2') #</li># } ##}#</ul></div></td><td role='gridcell'>#:data.availability==null?'':data.availability#</td><td role='gridcell'>#:data.searchCount==null?'':data.searchCount#</td></tr>' Generated code:'var $kendoOutput, $kendoHtmlEncode = kendo.htmlEncode;with(data){$kendoOutput='<tr data-uid="'+(data.uid)+'" role=\'row\'><td role=\'gridcell\'>'+(kendo.toString(kendo.parseDate(date, 'yyyy-MM-dd'), 'dd-MM-yyyy'))+'</td><td role=\'gridcell\'>'+$kendoHtmlEncode(data.salesCount==null?'':data.salesCount)+'</td><td role=\'gridcell\'><button type=\'button\' class=\'btn btn-info\' data-toggle=\'collapse\' data-target=\'';demo'></button><div id='demo' class='collapse'><ul>;$kendoOutput+='if (competitorPrice!=null){'; ;$kendoOutput+='for (var i=0,len=competitorPrice.length; i<len; i++){'; <li><b>;$kendoOutput+=':competitorPrice[i].competitorName '+$kendoHtmlEncode(</b>)+': kendo.toString(competitorPrice[i].price, \'n2\') ';</li>;$kendoOutput+=' } ';;$kendoOutput+='}';</ul></div></td><td role='gridcell'>;$kendoOutput+=':data.availability==null?\'\':data.availability';</td><td role='gridcell'>;$kendoOutput+=':data.searchCount==null?\'\':data.searchCount';</td></tr>;$kendoOutput+=;}return $kendoOutput;' 
at Error (native) 
at Object.compile (http://kendo.cdn.telerik.com/2016.2.607/js/kendo.all.min.js:25:7802) 
at Object.d [as template] (http://kendo.cdn.telerik.com/2016.2.607/js/jquery.min.js:2:3856) 
at init._tmpl (http://kendo.cdn.telerik.com/2016.2.607/js/kendo.all.min.js:50:16130) 
at init._templates (http://kendo.cdn.telerik.com/2016.2.607/js/kendo.all.min.js:50:17717) 
at new init (http://kendo.cdn.telerik.com/2016.2.607/js/kendo.all.min.js:48:16763) 
at HTMLDivElement.<anonymous> (http://kendo.cdn.telerik.com/2016.2.607/js/kendo.all.min.js:26:4091) 
at Function.each (http://kendo.cdn.telerik.com/2016.2.607/js/jquery.min.js:2:2881) 
at n.each (http://kendo.cdn.telerik.com/2016.2.607/js/jquery.min.js:2:846) 
at n.e.fn.(anonymous function) [as kendoGrid] (http://kendo.cdn.telerik.com/2016.2.607/js/kendo.all.min.js:26:4068) 

Alle Vorschläge würden sehr geschätzt werden.

Danke

Antwort

1

Sie in Daten-target = '# demo' fügen Sie einfach \ Schrägstriche vor # Zeichen Sonderzeichen # forgot entkommen.