This is a migrated thread and some comments may be shown as answers.

Invalid template in kendo-list-view

2 Answers 190 Views
ListView
This is a migrated thread and some comments may be shown as answers.
Johann
Top achievements
Rank 1
Johann asked on 20 Nov 2015, 05:21 PM

Hi,

 I develop a cordova application that runs on different devices. On Windows 10 it works ok but on IPhone i get the following error:

Error: Invalid template:'<div class="lk_mitteilungen_liste_mitteilingsliste_list_view_item" style="cursor: pointer;"><span class="data-id" ng-bind="dataItem.id" style="display: none;"></span><table class="db-layout" style="width: 100%;"><tbody><tr><td style="width: 100% !important; padding: 0px 5px 5px 0px;"><span id="lk_mitteilungen_titel" ng-bind="dataItem.titel" style=""></span></td></tr></tbody></table><table class="db-layout" style="width: 100%;"><tbody><tr><td style="width: 100% !important; padding: 0px 5px 5px 0px;"><span id="lk_mitteilungen_gueltig" ng-bind="dataItem.gueltig" style=""></span></td></tr></tbody></table><hr style="padding: 0px; margin: 0px; border: 0px; border-bottom: 1px solid #e6e6e6; height: 1px; width: 100%;"></div>' Generated code:'var $kendoOutput, $kendoHtmlEncode = kendo.htmlEncode;with(data){$kendoOutput='<div class="lk_mitteilungen_liste_mitteilingsliste_list_view_item" style="cursor: pointer;"><span class="data-id" ng-bind="dataItem.id" style="display: none;"></span><table class="db-layout" style="width: 100%;"><tbody><tr><td style="width: 100% !important; padding: 0px 5px 5px 0px;"><span id="lk_mitteilungen_titel" ng-bind="dataItem.titel" style=""></span></td></tr></tbody></table><table class="db-layout" style="width: 100%;"><tbody><tr><td style="width: 100% !important; padding: 0px 5px 5px 0px;"><span id="lk_mitteilungen_gueltig" ng-bind="dataItem.gueltig" style=""></span></td></tr></tbody></table><hr style="padding: 0px; margin: 0px; border: 0px; border-bottom: 1px solid ';e6e6e6; height: 1px; width: 100%;"></div>;$kendoOutput+=;}return $kendoOutput;'

 Here is my original Code for this site:

<kendo-list-view id="lk_mitteilungen_liste" k-data-source="termine" style="display: block; margin: 0px 0px 0px 0px;">
    <div  class="lk_mitteilungen_liste_mitteilingsliste_list_view_item" k-template style="cursor: pointer;">
        <span class="data-id" ng-bind="dataItem.id" style="display: none;"></span>
        <table class="db-layout" style="width: 100%;">
            <tbody>
                <tr>
                    <td style="width: 100% !important; padding: 0px 5px 5px 0px;"><span id="lk_mitteilungen_titel" ng-bind="dataItem.titel" style=""></span></td>
                </tr>
            </tbody>
        </table>
        <table class="db-layout" style="width: 100%;">
            <tbody>
                <tr>
                    <td style="width: 100% !important; padding: 0px 5px 5px 0px;"><span id="lk_mitteilungen_gueltig" ng-bind="dataItem.gueltig" style=""></span></td>
                </tr>
            </tbody>
        </table>
        <hr style="padding: 0px; margin: 0px; border: 0px; border-bottom: 1px solid #e6e6e6; height: 1px; width: 100%;" />
    </div>
</kendo-list-view>

 

What is wrong with the Template?

I use Kendo-UI with angularJS.

2 Answers, 1 is accepted

Sort by
0
Accepted
Alexander Valchev
Telerik team
answered on 24 Nov 2015, 08:17 AM
Hi Johann,

You have an unescaped "#" symbol in the template:

<hr style="padding: 0px; margin: 0px; border: 0px; border-bottom: 1px solid #e6e6e6; height: 1px; width: 100%;" />


Please check this help topic for more information:

  http://docs.telerik.com/kendo-ui/framework/templates/overview#escaping-hash-literals

Regards,
Alexander Valchev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Johann
Top achievements
Rank 1
answered on 26 Nov 2015, 07:58 PM
Thx, it works now.
Tags
ListView
Asked by
Johann
Top achievements
Rank 1
Answers by
Alexander Valchev
Telerik team
Johann
Top achievements
Rank 1
Share this question
or