I am using jQrid version 3.8.1 with subgrids. In my case, it doesn't really make sense for the user to be able to expand the subgrid while they are entering a new row. Since the parent row doesn't exist yet, there is nothing for the subgrid to show anyway. So what is the best way to disable or remove the subgrid expansion button (+ button) just for a row that is being created?
I saw this post, which could work, but seems a little hacky. Is there a more supported method?
I' mot sure that I correctly understand your scenario. I suppose that you add the row and then want to hide "+" button during inline editing of the new added row.
The exact implementation depends on how you add the row and which form of inline editing you use. In any way I would suggest you to hide the "+" button at the beginning of inline editing and to show it after the row could have subgrid information. You can use the following code for hiding the "+" icon
$("#" + rowid).find("td.ui-sgcollapsed>a").hide();
Additionally you would have to prevent expanding of the subgrid if the user do click on the "subgrid" cell (which contains the hidden "+"). You can do this by removing sgcollapsed
class (or sgexpanded
class):
$("#" + rowid).find("td.ui-sgcollapsed").removeClass("sgcollapsed");
To restore the original state (after saving the editing row) you need show the icon ($("#" + rowid).find("td.ui-sgcollapsed>a").show()
) and to add the class sgcollapsed
back to the <td>
element ($("#" + rowid).find("td.ui-sgcollapsed").addClass("sgcollapsed")
).
If you are sure that some row don't have any sbgrid then you can remove the "+" icon by setting empty string or
as HTML content of td.ui-sgcollapsed
call of the row. Additionally one can unbind the click
event from the cell. See the old answer for the corresponding code example.