I Have a TreeGrid with multiple levels I want to add Header for each level (i.e similar to that of subgrid, but i dont want to use it as the columns of subgrid doesnt align with the outer grid).
I would like to drive Porsche for free and that somebody should pay for the fuel additionally. :-) I think it's better that you use existing features of existing product if you want to use free products.
TreeGrid if jqGrid is the kind of grid. If the user collapse node the corresponding rows will be just made hidden. So the grid has column headers and no additional header can be created for tree node.
On the other side Subgrid, especially grid as subgrid, is more flexible. If you create subgrid inside of subGridRowExpanded callback you are free to set alignment, width or just everything from the child grid. You can even place any custom HTML an place of subgrid (see the demo from the answer). In the answer you will find an example how one can adjust width of subgrid if the column of main grid are resized.
So I think that you have to use grid as subgrid to implement your requirements. In any ways you should to write some additional code which implements your exact requirements.
Related
We have a request from our designers to build tables something like this, with rows that expand to show essentially another sub-table underneath. In KendoUI documentation, this is called "Hierarchy."
We use SlickGrid v2.3 with a few additional plugins. We currently have tables with a similar row expand/collapse like this: https://mleibman.github.io/SlickGrid/examples/example5-collapsing.html . That does not allow for a completely different set of columns in the sub-table.
The question is, can this be done in SlickGrid or not?
It might be hard to do with current SlickGrid, there's no code that handles the hierarchical part itself so that would be lot of work to implement in SlickGrid. However it is implemented in Slickgrid-Universal, which is a wrapper on top of SlickGrid. You can see Example 5 and Example 6 which shows 2 types of Tree Data grids (hierarchical or parentId refs). We use it in production for a project that we have. Also note that this is not a grid within a grid, it's rather an expand/collapse the same as what you found in example5-collapsing.html, the only differences with SlickGrid is that Slickgrid-Universal has the code to deal with hierarchical data (filtering/sorting) while SlickGrid itself doesn't and also another nice to know thing is that expand/collapse is actually using data filtering behind the scene and you can see that in the total items displayed when you have the footer enabled.
Please note that I'm the author of Slickgrid-Universal and also a major contributor to SlickGrid as well
At the moment, it can't be done. In order to achieve its speed, Slickgrid enforces a fixed row height and a single scrolling canvas. It's just a different approach than used by HTML display grids.
You could put together a workaround using mutiple slickgrids or an embedded slickgrid in a group row, I suppose, but it would be messy.
One thing I have done is develop a SlickCombo, which is essentially a grid presented as a multi-column dropdown. It's a full grid and can offer editing.
That's probably as close as you'd get.
A comment: the MLeibman repo is long dead - you should be using: https://github.com/6pac/SlickGrid
I am trying to create tabular report using JQGrid, JavaScript. I want to add a rowgroup header spanning whole row, and repeat this group using JQgrid and JavaScript. The data is going to come from JSON file.
I've already explored options of rowgroup using Jqgrid. But, instead of static header spanning, it gives header with expand/collapse function. It is not able to give Total for two rows in each column. Also I am not able to repeat leftmost column in it.
You can use plusicon and minusicon options which specify the icons used by jqGrid group. If you need to hold the icons hidden that the corresponding classes should have display: none prorty. For example you can use
groupingView: {
... // your other options
plusicon: "ui-helper-hidden",
minusicon: "ui-helper-hidden"
}
If you need customize the grouping row additionally, then you can use formatDisplayField callback. See the answer, this one, this post and this one.
I tried using the frozen columns and detail template both at a time but both they are not supported at a time by kendo telerik grid I get this error every time when I try:
'Uncaught Error: Having both detail template and locked columns is not supported'.
Could you please look into this error. Would you give me an idea, how could I achieve both detail template and frozen columns together in kendo.
http://www.telerik.com/forums/grid-column-locking-with-detail-template
Shankar
As conflicting nature it's not possible in kendo ( or either grid . e.g. Excel sheet too )
http://kendoui-feedback.telerik.com/forums/127393-telerik-kendo-ui-feedback/suggestions/6263744-support-row-templates-with-frozen-columns
one probable solution is :
Create two grids side by side. ( left grid for frozen column , right grid for details columns ) you can use same dataSource for both the grid .
Make div size fixed so user cannot scroll on left grid .
hide those repeating columns in Right grid.
add one more extra expand button column in left grid.
on click of expand button of left grid, expand appropriate right side detail row.
i know this is not actual solution with kendo and lots of code work around, but using jquery, tricks you can at least achieve up to certain level.
=> if you have any solution then please share it here sankar. looks like this is old post .
I have a jqgrid that has a lot of information for each record. It's causing a lot of horizontal scrolling and I'd like to avoid that.
I thought about using a subgrid, but every example I've seen for subgrid has the sub-info collapsed and I don't really want that. I just want the 2nd row for each record to be indented a bit.
Is there a good way to handle this besides using a subgrid. The other drawback to subgrid I've found is that it wants to load secondary data on the click to expand it. I'd rather just have all of the data loaded on the initial grid load.
TIA
I'm currently using jqGrid and ASP.Net MVC. With my current project, my goal is to provide a grid of data to the end user, and they can then edit this. The data is machine-generated, and the users will be confirming if the machine is correct or not.
I think ideally for speed, I'd like to provide a row per item, with a radio button group as the editable. The users could then pick from the values 'Unknown', 'Correct', 'Incorrect'.
As there will be a lot of data, I'd also like to provide a control of some type that can set all rows in the grid to one of the available radio button choices, for the user experience.
Given that there seems to be no native support for this in jqGrid, I wanted to ask if anyone has had any experience writing something like this, and whether this is achievable and reliable, or whether I should stick with the drop-down editable approach that is native to jqGrid.
To implement radio button as the editable instead of the standard drop-down editable approach you can use so named custom editing feature of jqGrid (see http://www.trirand.com/jqgridwiki/doku.php?id=wiki:common_rules#custom). This allows you to create any custom control to edit the cell value. An example of the implementation you can find here: Add multiple input elements in a custom edit type field.
To set all rows in the grid to one of the available radio button choices you can use either a control outside of jqGrid or add an additional custom button in the navigation bar (see http://www.trirand.com/jqgridwiki/doku.php?id=wiki:custom_buttons). If you search for navButtonAdd you will find a lot of examples how to implement this, for example, Jqgrid: navigation based on the selected row. Because you use server based data, you can just call a method on the server to make the changes which you need and then call trigger("reloadGrid") to refresh jqGrid data.