I am using Kendo grid with editable popup and I want to hide/not use the row which is showing editing changes on runtime.
Reason:
I have a kendo multiselect control in popup and on saving data it adds multiple rows in db and it should show in grid as well. That's why I don't want to show that editing changes line.
Solution
I was looking for a property of Kendo Grid to not show the editing row but didn't found so I removed the first row in edit function of Kendo Grid
$("#MyKendoGrid").kendoGrid({
dataSource: myDataSource,
//
// other properties
//
edit: function (e) {
$("#MyKendoGrid .k-grid-content table tr:first").remove();
}
});
Related
I've a kendo grid with Navigatable option, and the grid navigation is working fine when I press Tab. But when I make some columns in grid as locked (frozen columns), the grid navigation is not working as expected. The navigation is working for only frozen columns and then for unfrozen columns.
#(Html.Kendo().Grid<ProcessModel>()
...
.Navigatable())
dojo.telerik.com/#joeTopazz/ODEbA
Thanks in Advance.
When the Grid has its keyboard navigation enabled, tabbing inside the widget is managed only when incell editing is used. In your example with inline editing, tabbing is managed by the browser and the observed behavior is expected due to the separate tables used for the locked and unlocked columns.
To achieve the desired tabbing order, use incell editing, or set a tabindex for all buttons and inputs from the edit row in the Grid's edit event:
http://dojo.telerik.com/EVuNe
$("#grid").kendoGrid({
navigatable: true,
editable: "inline",
edit: function(e){
e.sender.wrapper
.find(".k-grid-edit-row input,.k-grid-edit-row a")
.attr("tabindex", 1);
}
});
I have a kendo grid and kendo treeview; the kendo grid data is bound to a database and the treeview is currently empty. How can I drag a single column single value from the grid to treeview? Could someone provide some suggestions or examples on how can I do this?
You can use kendo draggable, here is the overview :
LINK
To summary them up
make your grid as kendo draggable,
make your treeview droppable target,
on the drop function of the droppable target, do the logic to remove item from grid, then add it to treeview
HERE some raw example
kendo dojo (grid to treeview)
kendo dojo (listview to treeview)
I have a situation that user go to page with Kendo Grid and he can add new item to this Grid. Before he refresh page - new items are visible at the top of the Grid (stantard Kendo UI way)
I want to mark newly added rows, for example I want to have them shown in different colour than the "old' ones.
Is is possible to do this?
I would like to disable selection while the user is editing an item in an editable and selectable ListView
I've tried changing the selectable property of the Listview but it does not make any change.
See example here http://dojo.telerik.com/IvIkO
Hi for this add below given lines code after the initialization of list view in same example:-
$(document).on("click", ".product-view", function(e) {
//check any row in the List view is being edit
if (listView.items().hasClass("k-edit-item")) {
listView.clearSelection();
}
});
i have created a jsfiddle using your example and mine code, click on jsfiddle to see the working example for the same:-
http://jsfiddle.net/c2S5d/28/
I have a Kendo grid that when you click on a row, I would like it to update the contents of another grid on the page. How would you write a function to tell the grid to update the second grid? As an example, the first grid would be a list of states and the second grid would show all of the cities within the selected state.
Just bind the click event on the rows of your first table :
$("#states tbody").on("click", "tr", changeState);
and then change the data of your second table accordingly :
$("#cities").data("kendoGrid").dataSource.data(getListOfCities());
Here is just some sample code : jsFiddle