Hi,
We have the following issue when we are using Kendo UI Templates
Our application is translation labels directly into the Kendo UI Template. But when we get special characters, like we have in the danish language like æøå and ÆØÅ, it will translate it to xml codes æøå and ÆØÅ.
Because that it is using the character #, it will break the inline code also. Do Telerik have consider a way to handle situations like this, or is the only way to take care of it, on the client site through JavaScript code.
We are aware of, that we can make a escape code \ before the #, but we hope that Telerik have a better solutions for this ?
Thanks
Peter Beyer
CRM-Byggefakta
I'm using Kendo templates for the first time, and used a previous grid example to create a datasource object for my template. As a result, my template datasources all have a schema > model > fields section, which I've determined I (probably?) don't need. The issue I'm having, however, is that attempting to remove these bits of code causes a low-level error in the Kendo JS:
TypeError: e.slice is not a function ..._pristineTotal=a._total,a._pristineData=e.slice(0),a._detachObservableParents(),... kendo.all.min.js (line 11, col 23501)Here's the original datasource code:
var datasource = new kendo.data.DataSource({ transport: { read: { url: "/Controllers/MainController.cfc?method=getConfig", type: "get", dataType: "json", data: { ID: id } } }, schema : { type: "json", data: "Config", model: { fields: { CategoryIcon: { field: "CategoryIcon", type: "string" }, Category: { field: "CategoryName", type: "string" }, Page: { field: "PageName", type: "string" }, TileVisible: { field: "TileVisible", type: "number" }, ListVisible: { field: "ListVisible", type: "number" }, DefaultView: { field: "DefaultView", type: "string" }, SearchVisible: { field: "SearchVisible", type: "number" }, GroupByVisible: { field: "GroupByVisible", type: "number" }, GroupByDefault: { field: "GroupByDefault", type: "string" }, SortByVisible: { field: "SortByVisible", type: "number" }, SortByDefault: { field: "SortByDefault", type: "string" }, TagsVisible: { field: "TagsVisible", type: "number" }, TagsDefault: { field: "TagsDefault", type: "string" }, EnrolledVisible: { field: "EnrolledVisible", type: "number" }, CompletedVisible: { field: "CompletedVisible", type: "number" }, CatalogueVisible: { field: "CatalogueVisible", type: "number" } } } }});And here's some sample JSON returned from the function:
{"Config":{"CatalogueVisible":0,"GroupByVisible":1,"PageName":"Enrolled","TagsVisible":1,"ListVisible":1,"SortByVisible":1,"EnrolledVisible":1,"GroupByDefault":"Group","CategoryName":"Category 1","TagsDefault":"first tag","SearchVisible":1,"DefaultView":"tile","Tags":[{"Name":"Ceci est une phrase française que je suis en train d'utiliser pour tester les caractères spéciaux"},{"Name":"first tag"},{"Name":"random tag"},{"Name":"taggggggggg"},{"Name":"taggity"},{"Name":"this is a super long tag to test the new responsive learner dashboard for testing purposes wheeeeeee"},{"Name":"นี้เป็นประโยคฝรั่งเศสที่ฉันพยายามที่จะใช้ในการทดสอบตัวอักษรพิเศษ"}],"CompletedVisible":0,"TileVisible":1,"SortByDefault":"Course","CategoryIcon":"fa-icon-university"}}I started off trying to remove the whole model section, but got the error above. I then tried to remove the whole schema section, but got the same error. Then I thought it might be a specific field causing the error, so I went field by field, removing them one at a time until I got the error again. Unfortunately, it doesn't seem to be a specific field, since it's not until I got rid of all of them that there's an error again.
Here's an example of how I'm using these fields in my template:
<div class="row k-block k-block-no-radius"> <div class="col-xs-12 col-sm-9 action-row padding"> # if (data.TileVisible == 1) { # <a href="\#" onclick="javascript: generateCourseView('tile', #= data.EnrolledVisible #, #= data.CompletedVisible #, #= data.CatalogueVisible #);" data-role="button" class="k-button" role="button" aria-disabled="false" tabindex="0"> <i class="fa-icon-th-large"></i> </a> # } # # if (data.ListVisible == 1) { # <a href="\#" onclick="javascript: generateCourseView('list', #= data.EnrolledVisible #, #= data.CompletedVisible #, #= data.CatalogueVisible #);" data-role="button" class="k-button" role="button" aria-disabled="false" tabindex="0"> <i class="fa-icon-th-list"></i> </a> # } # <select id="display" class="content-box"> <option value="Default">Display</option> <option value="All">All</option> # if (data.EnrolledVisible == 1) { # <option value="Enrolled">Enrolled</option> # } # # if (data.CompletedVisible == 1) { # <option value="Completed">Completed</option> # } # # if (data.CatalogueVisible == 1) { # <option value="Catalgoue">Catalogue</option> # } # </select> # if (data.GroupByVisible == 1) { # <select id="groupby" class="content-box"> <option value="Default">Default</option> <option value="Category">Category</option> <option value="Group">Group</option> </select> # } # # if (data.SortByVisible == 1) { # <select id="sortby" class="content-box"> <option value="Default">Default</option> <option value="Course">Course</option> <option value="DueAsc">Due (asc)</option> <option value="DueDesc">Due (desc)</option> </select> # } # # if (data.TagsVisible == 1) { # <select id="category" class="content-box"> <option value="Default">Default</option> # for (t = 0; t < data.Tags.length; t++) { # <option value="#= data.Tags[t].Name #">#= data.Tags[t].Name #</option> # } # </select> # } # </div> <div class="clearfix visible-xs-block"></div> # if (data.SearchVisible == 1) { # <div id="search" class="col-xs-12 col-sm-3 action-row padding pull-right xs-margin-up"> <span class="k-textbox k-button k-space-left col-xs-12 search-box"> <i class="fa-icon-search"></i> <input value="Search..." /> </span> </div> # } #</div>I'm guessing it has something to do w/ the boolean checks I'm using in the template, but I'm not sure how to cast the values as booleans w/o using the schema model.
So two questions - do I need to have the schema model for a template? And if not, how do I prevent the errors I'm receiving when I remove it?
I'm trying to use the databound event with an MVC Kendo Grid, but DataBound is not in the list of options. I really need a javascript method to fire after the data is rendered to make use of it, and based research, I really can only do it with the databound event. I'm using version 2015.1.429.340 of the dll, which is the most recent I could find. I have Sync, Push, RequestEnd, many other events available. Just not DataBound.
My code looks like this:
@(Html.Kendo().Grid<type>()
.Name("name")
.Columns(columns =>
{
column stuff
})
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("method", "controller", new { id = "idstuff" }))
.Events(events => events.DataBound("method") )
)
.ToClientTemplate()
)
I hover over the red squiggly on DataBound and I see:
Kendo.Mvc.UI.Fluent.DataSourceEventBuilder does not contain a definition for DataBound and no extension method for DataBound accepting the first argument of type 'Kendo.Mvc.UI.Fluent.DataSourceEventBuilder' could be found.
Can someone please help me rectify this issue?
Thanks!
Are we able to bind the left and right side of the sliders to ng-models? For example, this is what I expect to be able to do:
http://dojo.telerik.com/OCuTI/73
Short summary:
- Enabled virtual scrolling of Grid
- Using Remote data source with paging
- When the user resizes our UI, it may adjust the Width of the Grid
- If this happens, our columns are set to wrap their contents
- After columns wrap, it appears the internal Kendo GRID logic does not recalculate the virtual scrolling offset/height/position so rows at the bottom of the grid are "lost" and can no longer be reached.
Best seen via demo: http://dojo.telerik.com/@nkoterba@blackpointcyber.com/EMeqI/3
Run the demo. Then scroll down to the very last record, which has ID 11077.
Then use the resizer in the DOJO window to **reduce** the width of the grid...notice how rows disappear and record 11077 is no longer even reachable.
Thoughts? Suggestions? on how to handle/fix this? It seems like the Kendo Grid should watch for resize activity and when it happens, ensure the internal scrolling logic is re-calculated so that users can reach bottom of list.
