Is there a way in jqgrid to select multiple cells? Ideally I want to toggle different cells and be able to restrict it in a way that only 1 cell can be toggled on in each row.
Is jqgrid suited for this or should I be using a different library?
Your requirement reminds me the requirement to select words in the grid instead of rows. You can implement this, but jqGrid could not help you here. On the other side if you select a row you can use Edit or Delete navigator button to remove it. There are internal parameters selarrrow and selrow which hold the id of the selected row.
If you really need to implement such custom selection you can use beforeSelectRow or onCellSelect event handler to do this. Yon can save the list of selected cells in your custom variable. You can use .addClass("ui-state-highlight").attr("aria-selected","true") for the <td> element instead of <tr> what jqGrid do. It is important that you will be not able to use any editing features of jqGrid in the case.
Related
With a button click in a row I need to expand the row whereas it can have different database values under same column label. It needs to show the transhipment of the ship from port to port.
Kindly help me deal with this problem or suggest me any reference so that I could try using jqgrid.
In this image a single row is split into 3 rows after the button click. it shows different values under a column. I need a likely output
You need to look at Guriddo jqGrid subgrid module. See documentation here and demo here - click on Hierarchy button at left in the accordion menu.
I want to manipulate the dom of all rows on a table but when I use a class to select buttons on my rows, only the 10 rows and the buttons on them shown with pagination will be selectable as jquery objects. Is there a way to select any row on a table regardless of being shown or not?
I'm seeing two different questions here. If you want to "manipulate" all rows in some way (like adding 100 bucks to a column, etc..), I would do that at the 'source' of my data (array, database table, whatever), then refresh the Datatables. If you simply want to "select" any row, you can use the Datatables 'search' functionality. It's pretty well documented at https://datatables.net/reference/api/search() . Am I not understanding your question?
I have created a table using semantic-ui in my Meteor JS web app.
That table displays the list of names that is on my DB.
I would like to make the rows of that semantic-ui table selectable in the true sense and not just selectable in appearance.
At the moment, when the mouse hovers over a row, that row gets highlighted (changes shade) which makes it appear selectable, but when you click on it, it does not call or trigger a javascript function and therefore it is not truly selectable.
How do I make that table truly selectable?
How does one do this?
Is it possible?
or do I just have to add a button beside the texts for each table and have the user click that button instead?
I could add the buttons in each cell but I really would prefer it if the whole row is selectable instead.....
Thank you very much...
You just have to add class or id on <tr> and then use that class to add function you want to that row. For creating a function you will need to use meteor template events and you can learn more about it here.
I also created an rough example on jsfiddle that you can follow, just replace with your own classes and template and file names. :)
I hope that helps you!
I need to populate my subgrid which shows some of the columns from main grid without actually going and getting data again using URL? Example:Main Grid is getting data from server (10 columns) using jsonReader. Out of which I want to show 7 columns in the parent row and 3 columns in the subgrid row . Can I do this? (Or some other way to achieve this expand concept?)
One possible workaround to use the sub-grid as 1-1 with main grid, instead of as parent-child : query all the columns as normal in the parent grid, but set the ones you don't want in main row as hidden. Then in sub-grid load event, access those fields using the "parent" row id and create them as custom fields or simply emit custom html.
This does cause duplication of the fields though, since the original main grid fields are still present, even if hidden. The html ids will get duplicated and may cause conflicts if you don't handle them.
Perhaps there is a cleaner way to do it than this (which I'm sure #Oleg will show us any minute now!)
But I wish jqgrid had a documented feature to more easily handle this kind of thing. It is very useful because you get the benefit of full inline editing in the subgrid, so you can design a much nicer edit form (eg. multiline textareas) than when confined to one straight line.
Note the presence of this feature in other grids.
Jquery EasyUI Datagrid demo
Telerik Grid Editing Demo
Up to now I have a simple HTML table with an extra column which contains a <ul> element which is marked dropable. I have a list of elements below the table and are able to drag that tags to the specific cell to tag a displayed datarow (with ajax server communication and stuff).
Now I want a more fancy table which allows for column sorting, reordering, searching and paging and have also that simple drag 'n drop (if possible) tagging of specific rows. I'm looking at maybe jquery datatable or flextable (or similar powerful library) and add a column which allows that kind of dynamic editing.
I see at least two options: Try to implement drag'n drop inside the table to have the same as before or try to write a cell editor which uses a "tag" library (for example http://tagedit.webwork-albrecht.de/ ) but I would need a library which lets you only choose pre-existing tags easily.
My question: Is any of this two options possible, and if, how? Or is there a more "out of the stock" option to do that?