Hello,
We have an MVC web app and have a kendo grid with batch editing. One of the columns is a dropdownlist. (using columns.ForeignKey())
It works perfectly in FireFox. However, it doesn't work at all in Chrome, and you have to double click in Internet Explorer (shows a textbox on first click, then ddl after second click).
To demonstrate the behavior, I created a new telerik MVC project with a grid. I noticed that the template uses jQuery version 1.10.2. Our project is using jQuery version 3.1.1. So I tried switching our project to use 1.10.2 -- and the grid dropdownlist starting working fine in all browsers.
1. Does kendo require you to use a specific (old) version of jQuery?
2. Any suggestions? I hate switching the jQuery version and regression testing the entire app...
* I tried to reproduce in a simple application, but could not. I'm not sure what it is about our grid that causes the issue - but I do know when I toggle between the 2 versions of jQuery, it works with 1.10.2, and not with 3.1.1.
Thanks


This is solved and doesn't need to be answered. I just put it here in case someone runs into the same problem.
A treeview item says it has children altough there are no children by using "hasChildren":
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script> <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.2.504/styles/kendo.common.min.css" /> <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2017.2.504/styles/kendo.blueopal.min.css" /> <script src="http://kendo.cdn.telerik.com/2017.2.504/js/jquery.min.js"></script> <script src="http://kendo.cdn.telerik.com/2017.2.504/js/kendo.all.min.js"></script> </head> <script> $(document).ready(function() { // Bind dropdownlist $("#mytree").kendoTreeView({ animation: false, dataSource: [ { 'id': '1', 'text': 'One child entry', 'expanded': 'true', "items": [ {'id': "2", 'text': "No child entry", "items": []} ] } ], select: function(e) { var treeItem = this.dataItem(e.node); if (treeItem.hasChildren) { alert ("Entry has children"); } else { alert ("Entry has no children"); } } }); }); </script> <body> <div id="mytree" style="clear: both;"></div> </body></html>
You can run this code and click on the treeview entry "No child entry". It will tell you it has children! Why? The problem is on the predefinition in the datasource: ... ,"items": []
Remove that and it will work fine. I thought the Treeview Widget would take that over or replace it. But since it outputs wrong result, don't use it that way.
This code is driving me insane I have a click event that fires upon a radio button selection. It then executes jquery that should hide the row, however it doesn't. The code is as follow:
document.getElementById("showSubOrgs").addEventListener("click", function () {
ShowSubOrganisations();
});
function HideSubOrganisations() {
var grid = $("#gridOrganizations").data("kendoGrid");
var gridData = grid.dataSource.view();
for (var i = 0; i < gridData.length; i++) {
var currentOrgid = gridData[i]._OrganisationID;
var ParentOrgID = gridData[i]._ParentOrganisationID;
if (currentOrgid != ParentOrgID) {
debugger;
grid.table.find("tr[_OrganisationID='" + currentOrgid + "']").hide();
}
}
};

//show server errors if any function error_handler(e) { if (e.errors) { var message = "Errors:\n\n"; $.each(e.errors, function (key, value) { if ('errors' in value) { $.each(value.errors, function () { message += this + "\n\n"; }); } }); alert(message); } }
@(Html.Kendo().Grid(Model) .Name("SchoolGrid") .Columns(columns => { columns.Bound(p => p.SchoolID).Width("80px"); columns.Bound(p => p.Name); columns.Bound(p => p.Campus).Width("90px"); columns.Bound(p => p.StateCode).Width("90px"); columns.Bound(p => p.SectorCode).Width("95px"); columns.Bound(p => p.MDISurveyStartDate).ClientTemplate("#= (MDISurveyStartDate == null) ? 'Not Set' : kendo.toString(MDISurveyStartDate, 'dd/MM/yyyy') #").Width("90px"); columns.Bound(p => p.MDISurveyEndDate).ClientTemplate("#= (MDISurveyEndDate == null) ? 'Not Set' : kendo.toString(MDISurveyEndDate, 'dd/MM/yyyy') #").Width("90px"); columns.Command(command => { command.Edit(); command.Destroy(); }).Width("190px").HtmlAttributes(new { style = "text-align:center" }); }) .ToolBar(tb => tb.Create().Text("Add New School")) .Editable(ed => ed.Mode(GridEditMode.PopUp).TemplateName("EditSchool").Window(w => w.Title("Add/Edit School Details").Name("editWindow").Width(600))) .DataSource(dataSource => dataSource .Ajax() .Model(model => model.Id(p => p.ClientID)) .Events(e => e.Error("error_handler")) .Read("Read_Schools", "School") .Update("Update", "School") .Create("Create", "School") .Destroy("Destroy", "School") ) )
[HttpPost] public ActionResult Update([DataSourceRequest] DataSourceRequest request, School school) { try { if (ModelState.IsValid) { string errMsg = ""; if (!_Service.UpdateSchool(school, out errMsg)) ModelState.AddModelError("UpdateSchool", errMsg); } } catch (Exception ex) { ModelState.AddModelError("UpdateSchool", ex.Message); } return Json(ModelState.ToDataSourceResult()); }
Hello
The KendoUI Splitter would be the perfect solution for what I want to do. I ran into the follow three style problems you may know the answer:
1. The default color of the panes is white. I need to have them transparent what is ignored by the Splitter. How can I remove the defaulted white?
2. How can I change the color of the most outer frame border? (the one surrounding both panes)
3. On hovering the splitter an arrow is coming up. This is imho missleading. The arrow has only one head, should have two since you can move the splitter in two directions. How can I change that?
Greetings
Hello there
I'm wondering if it is possible to select the last item inside a node. Example:
A + (main node)
A1 + (child node of A)
A2 + (child node of A)
B + (main node)
The plus sign (icon) behind each item is kinda an add item functionality inside that node. F.e. if I click on the + behind the A it would create a child item inside its node, in this case A3 + :
A + (clicked on the +)
A1 +
A2 +
A3 + (new item created)
B +
That works fine. What I want now after creating a newitem that way is to SELECT (jump) the newly created item:
A +
A1 +
A2 +
A3 + (item is selected)
B +
I'm aware of this: treeview.select(".k-item:last");
In my case it would jump to B + (always to the end of the very last item. Can I somehow (easily) restrict the "last" so it would jump to the last element inside the node I have added a new item?
Regards
Hi,
I have found a problem when having text with ampersand in the data used for a pivot grid when expanding the row or column with that ampersand in the caption. A JavaScript exception is caused in the browser (Chrome & IE). The exception is "Uncaught TypeError: Cannot read property 'value' of undefined at init._buildRow" in kendo.all.js:73938. The undefined object is dataItem.
I have encoded the ampersand using & within the string at the datasource and whilst that is displayed correctly I believe the & within the encoded & is still causing the exception. I have tried using the rowHeaderTemplate and the row encoded property but neither seem to stop the error from occurring. Is there another way I should be encoding this text so that it doesn't break the JavaScript code?
My original project is Kendo UI for MVC but I have created a dojo using the JavaScript version to re-create the problem.
dojo.telerik.com/@amdenley/OkEqIV/2
I have a grid on an MVC page, I have an error event as follows:
.DataSource(dataSource => dataSource
.Ajax()
.Batch(false)
.PageSize(50)
.Events(events => events.Error("gridErrorHandler"))
My JavaScript function is something like:
function gridErrorHandler(e) {
...
}
I have an MVC method (that returns ActionResult) that throws the following error when an error condition occurs:
return new HttpStatusCodeResult(System.Net.HttpStatusCode.InternalServerError, "Unexpected error");
My question is this. When my MVC method throws an exception, my JS error handler gets called. But, no matter what I try, I'm not able to get at the type of error it is. What exactly is the correct JS code that tells me a 500 error occurred, or a 401 (unauthorized) error occurred, etc.?
