I've got an array that, on its own, produces a grid no problem. I want to add one more row by pushing or adding to the datasource beforehand. Console.log after push shows the new array to be valid, but nothing appears on the Grid. Using add rather than push causes ONLY the new item to be display, while console.log shows all the items. Any ideas what gives?
EDIT: More strangely, I can loop through entries of a given array, extract some text and push that to a new array using ({'text':item[i].text}), but then outside of the loop pushing ({'text':'other text'}) doesn't show up as a row. Ugh.
EDIT #2: I've fixed the issue with the push to new array. Still not clear on certain kendoGrid functionality though, almost seems worth ignoring it altogether and just using kendoListView and utilising templates.
Related
I'm developing an app using the amazing angularslickgrid.
Till now, i haven't got any problem, buy I found out an strange behaviour on it.
In the ngOnInit I wrote the following code:
ngOnInit(){
this.defineGridHeaders();
this.defineGridOptions();
this.obtainData();
}
Till this moment everything works well and the grid load correctly the data including the RowSelection column.
The problem is when I try to change the columndefinition, and perfrom a reset() like this:
this.defineGridHeaders();
this.angularGrid.gridService.resetGrid();
The new colums have been loaded correctly but i lose the rowSelection column.. :(
I've tried to include the defineGridOptions() function in the middle of the defineGridHeaders() and resetGrid() but the result is the same.
In the this.defineGridHeaders() I just perfom the following:
this.columnDefinitions = [];
[...FIELDS CREATION...]
const col = {
id,
name,
field,
sortable,
filterable,
type,
editor,
formatter,
filter,
outputType,
params,
minWidth: minwidth,
width: width,
header: header,
excludeFromExport,
excludeFromGridMenu,
excludeFromQuery,
excludeFromHeaderMenu
};
this.columnDefinitions.push(col);
Could someone help me on this?
Many Thanks!
Please note that I'm the author of Angular-Slickgrid and you opened an issue with the same question on GitHub, I'll simply reply with the same answer here
a reset is a reset, so it won't keep that. But I added the Row Selection in the Grid State not that long ago, so you could get it from there (just check the Grid State/Presets - Wiki. Dynamically adding a new column can be seen in this Example 3, you should look at the code on how to make it show up correctly (you can't just add it, you need to manually trigger a dirty change call, look at the example code for that)
Also to add a bit more to this, SlickGrid Row Selection is by row index, it's not by row data. Meaning that if your data changes when you refresh or something and you keep the row selection it will not synched anymore... all that to say, just remember, it's a row index, so pay attention when you want to keep or want to reapply a row selection.
If it's just to row selection that you lose, just save it before adding a column and put back the selection after adding the column. It's simple, get the row selection (with getSelectedRows) before you change the column definitions, add your new column and then put back the selection (with setSelectedRows).
I'm trying to use a kendo.data.ObservableArray as data for data source of the grid. It shows ok. When edit inline, change a field, then cancel, the values are changed. When clicking edit, then click edit on another row, the last one remains in the edit mode. Sometimes cancel not work. On the array it works as expected.
I took the Kendo UI Demo, http://demos.telerik.com/kendo-ui/grid/editing-inline, to reproduce the issue. Here is the issue: http://dojo.telerik.com/uLiCi/2
Does anyone have any idea why so strange behavior?
In my opinion, it should work with both, array and observable array.
Thanks in advance
I'll keep the question below, but if anybody else has this problem the issue was a bug in kendo and has been fixed in the most recent version. So the solution is to update to the latest kendo release.
I've been trying to find a good way of listing all of the nodes in a kendo-ui treeview, and have managed to put together a pretty solid way of doing so. First I define the dataSource, for the sake of simplicity let's say:
data = [
{text:element1, items:[
{text:element2},
{text:element3}]},
{text:element4}]
Then, I set the data source as an observableHierarchy:
my_treeview.setDataSource(kendo.observableHierarchy(data));
When I want to access the list of nodes, I can get a JSON object with:
my_treeview.dataSource.data().toJSON();
This works well; it produces a correct, properly-formatted JSON object. If I call JSON.stringify on the above, I get:
[{"text":"element1","items":[{"text":"element2","items":[]},{"text":"element3","items":[]}]},{"text":"element4","items":[]}]
However, when I enable drag and drop on my tree and drag an element into a different parent, it disappears from the json output. For example, if I drag element3 into element4, the json object returned is:
[{"text":"element1","items":[{"text":"element2","items":[]}]},{"text":"element4","items":[]}]
Which is the equivalent of:
data = [
{text:element1, items:[
{text:element2}]}
{text:element4}]
The table's display remains correct, however, with element 3 appearing to be a child of element4. So my question is, how can I get the dataSource to update properly with drag & drop?
If anybody else has this problem, the issue was a bug in kendo which has been fixed in the most recent version. So the solution is to update to the latest kendo release.
I have a UI that looks similar to the mail app. A table view along the left with a single column of items. When one of the those items on the left is selected, details about that item are shown on the right.
When some event occurs in my app that requires the data in the left table view to be reloaded, the current selection is lost and then the right detail view and left master view get out of sync.
The way i hoped to solve this problem was, when it was time to reload the table data, I would:
1. Save the current selected item
2. reload the table data
3. Handle a delegate method or notification that let me know when the reloading was done.
4. Re-select the proper item by finding it in the new list of items in the table.
Unfortunately I cannot find any way to determine when the table is done reloading. Is there a. any way to figure this out, or b. a more elegant solution to this problem?
thanks.
update: In case my problem was unclear, imagine you are in the mail app and you have some message selected. That summary cell is shown as selected on the left, and the details of the message are shown on the right. Suppose new mail comes in which appear as new cells at the top of the table. How is the message you are currently viewing preserved, and not de-selected?
reloadData is something of a sledgehammer. 10.7 offers a better solution.
Instead of using reloadData, when you have new rows to add, use insertRowsAtIndexes:withAnimation: . When you have rows to delete, use removeRowsAtIndexes:withAnimation: . And, of course, if an existing row has changed, there's reloadDataForRowIndexes:columnIndexes.
These should remember the selection for you (at least, the equivalents on iOS do).
If you can't target 10.7, some of the other suggestions will probably help out. noteNumberOfRowsChanged may also be helpful but I've not actually used it.
You can save selection on tableView(_:shouldSelectRow:) then select the row right after you create the cell in tableView(_:viewFor:row:) using selectRowIndexes(_:byExtendingSelection:).
It is pretty reliable no matter how / when / how many times you reload the table.
I have a grid that is populated by a JSON response (MVC3 controller) that has a userData component for some additional data for grid captions, etc. All that works just fine. I recently switched the the grid's data loading to "loadonce: true" as in working with larger grid results sets, I wanted client-side sorting and filtering. All that works good. BUT, I was surprised that the userData got wiped the first time I clicked any column for sorting. If I turn off loadonce, userData is fine, but it is of course going back to the server each time. The items that make use of the userData fire on gridcomplete and are now coming back "undefined" after a sort (and probably anything that reloads the grid). Any thoughts why this might be happening? Oh yeah, I also noticed that clicking a column sort wiped out any multiselections (perhaps related to the same culprit?).
Thanks,
Mark
You are right. +1 from me. It's a jqGrid bug. Inside of internal addLocalData method after the line 1527 of the file grid.base.js of jqGrid 4.1.2 or after the 1532 of jquery.jqGrid.src.js (you can get modified version from here) one should add the following line
retresult[ts.p.localReader.userdata] = ts.p.userData;
It will fix the problem. I posted the corresponding bug report here.