Dear Team,
I am new to Kendo control, please help me with this, I already have Tree View as shown in the attachment, Now I have two(Expand and Collapse) buttons, I need to perform the 'Expand All' on click of Expand button and 'Collapse All' on click of Collapse button.
How to perform 'Expand All' and 'Collapse All' in Kendo Tree View on click of Expand button and Collapse button.
Please help me on this.

We need to get rid of Hibernate (change it to JDBC-driver).
We use springdemos and have already changed 90% of code, but we don't inderstand how to get rid of this function:
@Override
public DataSourceResult getList(DataSourceRequest request) {
return request.toDataSourceResult(sessionFactory.getCurrentSession(), TObjectType.class);}
---
Full code of TObjectTypeDaoImpl (it's model):
--
package com.kendoui.spring.models;
import org.hibernate.Session;
import com.kendoui.spring.models.TObjectType;
import org.hibernate.SessionFactory;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Component;
import org.springframework.transaction.annotation.Transactional;
import java.sql.*;
import java.util.ArrayList;
import java.util.List;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
@Transactional
@Component
public class TObjectTypeDaoImpl implements TObjectTypeDao {
@Autowired
private SessionFactory sessionFactory;
private ConnectionToPostgresql cn;
{ try { cn = new ConnectionToPostgresql(); }
catch (Exception e) { e.printStackTrace(); } }
@SuppressWarnings("unchecked")
@Override
public List<TObjectType> getList() {
//return sessionFactory.getCurrentSession().createCriteria(TObjectType.class).list();
Connection connection = cn.getConnection();
List<TObjectType> result = new ArrayList<TObjectType>();
try {
Statement statement = connection.createStatement();
ResultSet resultSet = statement.executeQuery("SELECT * FROM \"TOBJECT_TYPE\"");
while (resultSet.next()) {
TObjectType to = new TObjectType();
to.setIdObjectType(resultSet.getString("ID_OBJECT_TYPE"));
to.setDescription(resultSet.getString("DESCRIPTION"));
to.setObject1C(resultSet.getString("OBJECT_1C"));
result.add(to);
}
return result;
} catch (SQLException e) {
e.printStackTrace();
return null;
}
}
@Override
public DataSourceResult getList(DataSourceRequest request) {
return request.toDataSourceResult(sessionFactory.getCurrentSession(), TObjectType.class);
}
@Override
public void saveOrUpdate(List<TObjectType> products) {
// Session session = sessionFactory.getCurrentSession();
// for (TObjectType product : products) {
// session.saveOrUpdate(product);
// }
//Connection connection = cn.getConnection();
for (TObjectType product : products) {
Connection connection = cn.getConnection();
String item = product.getIdObjectType();
try {
if (item.equals(""))
{
System.out.println("New User");
Statement statement = connection.createStatement();
PreparedStatement preparedStmt = connection.prepareStatement("INSERT INTO \"TOBJECT_TYPE\" (\"DESCRIPTION\",\"OBJECT_1C\") VALUES (?, ?)");
preparedStmt.setString(1, product.getDescription());
preparedStmt.setString(2, product.getObject1C());
//preparedStmt.setString(1, product.getIdObjectType());
preparedStmt.executeUpdate();
connection.close();
}
else {
System.out.println("Update user");
PreparedStatement preparedStmt = connection.prepareStatement("UPDATE \"TOBJECT_TYPE\" SET \"DESCRIPTION\" = ?, \"OBJECT_1C\" = ? where \"ID_OBJECT_TYPE\" = ?");
preparedStmt.setString(1, product.getDescription());
preparedStmt.setString(2, product.getObject1C());
preparedStmt.setString(3, product.getIdObjectType());
preparedStmt.executeUpdate();
connection.close();
}
} catch (SQLException e) {
e.printStackTrace();}
}
}
@Override //если добавляем
public void saveOrUpdate(TObjectType product) {
// Session session = sessionFactory.getCurrentSession();
// session.saveOrUpdate(product);
System.out.println("Вызвался метод saveOrUpdate(TObjectType product)");
}
@Override
public void delete(TObjectType product) {
System.out.println("Вызвался метод delete(TObjectType product)");
//Session session = sessionFactory.getCurrentSession();
//session.delete(session.load(TObjectType.class, product.getIdObjectType()));
}
@Override
public void delete(List<TObjectType> products) {
// Session session = sessionFactory.getCurrentSession();
// for (TObjectType product : products) {
// session.delete(session.load(TObjectType.class, product.getIdObjectType()));
// }
for (TObjectType product : products) {
Connection connection = cn.getConnection();
try {
PreparedStatement preparedStmt = connection.prepareStatement("DELETE FROM \"TOBJECT_TYPE\" WHERE \"ID_OBJECT_TYPE\" = ?");
preparedStmt.setString(1, product.getIdObjectType());
preparedStmt.executeUpdate();
connection.close();
}
catch (SQLException e){ e.printStackTrace();}
}
}
}
I have used Kendo Grid in my project to display data. Here to insert grid data in my datasource, i have used the bellow code. But in the bellow code in insert statement i have provided field name of grid and have values assigned to it.
For example(AMOUNT: objGridData[idx].AMOUNT)
Hence my requirement is, that i need to do insert in my datasource without specifying field name as in future columns of grid might change for example can we use "datasource.add()".
// Insert Records to the Grid for (var idx = 0; idx < objGridData.length; idx++) { var newrec= grid.dataSource.insert(idx, { AMOUNT: objGridData[idx].AMOUNT, id: objGridData[idx].id, PERCENT: objGridData[idx].PERCENT, PRODUCT1: objGridData[idx].PRODUCT1, PRODUCT2: objGridData[idx].PRODUCT2, PRODUCT3: objGridData[idx].PRODUCT3, PRODUCT4: objGridData[idx].PRODUCT4, });}Any suggestion would be helpful.
Thanks
Hello,
I want to change ComboBox placeholder dynamically if there is no data return from api.
<!DOCTYPE html><html><head><title></title><link rel="stylesheet" href="styles/kendo.common.min.css" /><link rel="stylesheet" href="styles/kendo.default.min.css" /><link rel="stylesheet" href="styles/kendo.default.mobile.min.css" /><script src="js/jquery.min.js"></script><script src="js/kendo.all.min.js"></script></head><body><div id="example"><div class="demo-section k-content"><h4>Find a product</h4><input id="products" style="width: 100%;" /><div class="demo-hint">Hint: type at least three characters. For example "che".</div></div><script> $(document).ready(function() { $("#products").kendoComboBox({ placeholder: "Select product", dataTextField: "ProductName", dataValueField: "ProductID", filter: "contains", autoBind: false, minLength: 3, dataSource: { type: "odata", serverFiltering: true, transport: { read: { url: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Products",}}}});});</script></div></body></html>
if Above url not return any data then I want to change my Placeholder to "Try Again".
I'm having an issue with an instance of the kendoScheduler. What's going on is, all crud operations, in addition to read, seem to want to use the 'get' type. I'm using the code from the demo on this site. So I figured, OK, I'll just add in the type: 'put', say for for update method. Still doesn't work.
On the other side of things, I'm using web api and I have all my different actions in the controllers, say, we're dealing with the update one only here - I have the [httpPut] attribute on top of the action. And I'm getting the 405 method not allowed error.
Playing around, on the client side of things, I changed the updates type, to get, and add [httpGet] to the controller (even though this clearly isn't what I want here) - when I debug this, it finds the respective action, but the model is null.
What's going on when I have httpput on the controller and why on the front end is all crud operations trying to use a get?
Thanks.
Hello,
I have a chart for which I added 2 series with a date category field. The step used for the categories are 1 hour. However my data begin on 00:45 and ended on 9:45.
I would like to be able to display 00:45 , 01:45 ,02:45 etc.. On my categories axis label. Most importantly, I would also like to be able to display the real point using a tooltip template
I have tried a couple of things but It never worked how I intended it to work.
I've noticed that using a tootltip template like :
tooltip: { visible: true, template: "#= '<b>' + dataItem.date + '</b>' #" }I was able to get the real x coordinnates (00:45, 01:45 etc..)
But When I use something like that:
tooltip: { visible: true, template: function(e){ return e.category; }I'm not getting the real axis point.
In each case I didn't find any parameter in "e" that represent the real axis date point.
Here's an example of what I'm talking about:example
I would also state that I wanted to used the same kind of template in order to display the categories labels.
So in summary What I want is to be able to get the real points using tooltip template and categoryAxis label template in the form of a javascript function.
Any help will be appreciated.
Regards
Hello,
I am currently utilizing the JQuery Kendo UI Grid (v2018.3.1017) with keyboard navigation and editing. I have noticed that when utilizing the tab key navigation abilities with the if you are on the last column of a row, a console error will be thrown on the tab key press, and navigation does not continue to the next row.
After digging into the kendo grid source code, I found that the cause seems to be that the hierarchy cell is actually being selected by the navigation logic, and the editCell method is being fired on this cell. Which leads to the console error in the attached image.
I found that the cause for this seems to revolve around the _tabNext method, which is using a selector (DATA_CELL) that is incorrect. The selector (:not(.k-group-cell):not(.k-hierarchy-cell:not(:has(.k-icon.k-i-collapse,.k-icon.k-i-expand))):visible) does not properly ignore hierarchy cells.
We have fixed this issue in our logic by overwriting the selector with the following selector (td:not(.k-group-cell):not(.k-hierarchy-cell):visible).
We have not yet upgraded to the 2019 version of the Kendo UI Grid, so I'm not sure if this issue has been addressed or not, but wanted to make your team aware of it.
Hi, I'm implementing a Scheduler in .NET using MVC. The scheduler runs on top of Jquery. But my code is not working. I needed to try if I can use my own data, so I wrote my own controller method to retrieve data from a database and return it in JSON and not JSONP since it's all running on the same host. My view is as follows.
Index.cshtml
@{
ViewBag.Title = "Index";
}
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.3.913/styles/kendo.common.min.css" />
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.3.913/styles/kendo.rtl.min.css" />
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.3.913/styles/kendo.silver.min.css" />
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.3.913/styles/kendo.mobile.all.min.css" />
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2017.3.913/js/kendo.all.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/kendo-ui-core/2014.1.416/js/kendo.timezones.min.js"></script>
<h2>Index</h2>
<div id="example">
<div id="team-schedule">
<div id="orders">
<input checked type="checkbox" id="order1" aria-label="Order 1" value="200023">
<input checked type="checkbox" id="order2" aria-label="Order 2" value="200027">
<input type="checkbox" id="order3" aria-label="Order 3" value="200033">
</div>
</div>
<div id="scheduler"></div>
</div>
@section SchedulerScripts{
<script>
$(document).ready(function() {
$("#scheduler").kendoScheduler({
date: new Date("2013/6/13"),
startTime: new Date("2013/6/13 07:00 AM"),
height: 600,
views: [
"day",
{ type: "workWeek", selected: true },
"week",
"month",
"agenda",
{ type: "timeline", eventHeight: 50}
],
timezone: "Etc/UTC",
dataSource: {
batch: true,
transport: {
read: {
url: "http://localhost:51329/Scheduler/SchedulerJSONData", //This is the URL to retrieve my JSON data. Scheduler is the //controller where the SchedulerJSONData method is implemented.
dataType: "json"
},
parameterMap: function(options, operation) {
if (operation !== "read" && options.models) {
return {models: kendo.stringify(options.models)};
}
}
},
schema: {
model: {
id: "orderId",
fields: {
orderNo: { from: "ORDER_NO" },
releaseNo: { from: "RELEASE_NO" },
operationNo: { from: "OPERATION_NO" },
start: { type: "date", from: "OP_START_DATE" },
end: { type: "date", from: "OP_FINISH_DATE" },
description: { from: "OPERATION_DESCRIPTION" },
}
}
},
filter: {
logic: "or",
filters: [
{ field: "orderNo", operator: "eq", value: '200023' },
{ field: "orderNo", operator: "eq", value: '200027' },
{ field: "orderNo", operator: "eq", value: '200033' },
]
}
},
resources: [
{
field: "orderNo",
title: "Order",
dataSource: [
{ text: "Order 1", value: '200023', color: "#f8a398" },
{ text: "Order 2", value: '200027', color: "#51a0ed" },
{ text: "Order 3", value: '200033', color: "#56ca85" }
]
}
]
});
$("#orders :checkbox").change(function(e) {
var checked = $.map($("#orders :checked"), function(checkbox) {
return parseInt($(checkbox).val());
});
var scheduler = $("#scheduler").data("kendoScheduler");
scheduler.dataSource.filter({
operator: function(task) {
return $.inArray(task.orderNo, checked) >= 0;
}
});
});
});
</script>
}
My controller method to retrieve data from the database is as follows.
public ActionResult SchedulerJSONData() {
con.Open(); //con is my database connection string.
OleDbDataAdapter oda = new OleDbDataAdapter("SELECT ORDER_NO, RELEASE_NO, OPERATION_NO, OP_START_DATE, OP_FINISH_DATE, OPERATION_DESCRIPTION FROM SHOP_ORDER_OPERATION_TAB where ORDER_NO='200023' OR ORDER_NO='200027' OR ORDER_NO='200033'", con);
DataTable dt = new DataTable();
oda.Fill(dt);
string JSONString = string.Empty;
JSONString = JsonConvert.SerializeObject(dt);
return Json(JSONString, JsonRequestBehavior.AllowGet);
}
This method returns the JSON data correctly, but when I plug the URL in bold above to retrieve the JSON in the scheduler, it doesn't work. Can anyone figure out what I have done wrong?

Is the Select event supported with the MVVM DropDownTree? When I modify the example for the MVVM DropDownTree, it doesn't fire
<input data-role="dropdowntree" data-text-field="text" data-value-field="id" data-bind="value: selectedProduct, source: products, events: { change: onChange, select: onSelect }" />Added to viewModel:onSelect: function() { kendoConsole.log("event :: Select");},