Jqgridjqgrid Table Action column, click the action button flyout layer

When using Jqgrid, the last column in the table is the Action column, and each row in the Action column has an action button that resembles a drop-down menu, as shown below:

When you click on the "Action" column in the table, you need to pop up a div layer that contains a bunch of buttons to manipulate the table row, as follows:

The steps to resolve are as follows:

1. First, add the attribute edittype: ' Select ' and method Formatter:groupGrid.formatOptions on the columns in Colmodel, as shown below:

Easy to copy, the code is as follows:

{label: ' Operation ', Name: ' Operations ', Index: ' Operations ', width:80, sortable:false,align: ' Center ', cellattr:addcellattr,
	editable:true,edittype: ' select ', Formatter:groupGrid.formatOptions
}

The Formatoptions method is shown in the following diagram, and the HTML code is spliced in the method:

Description: One of the single quotes I used was "\" to escape. The parameter values in the request URL are obtained from the rowobject .
2, second, the above code to add a table in the processing Operation button, but only the Operation button, when the "Action" button when the pop-up layer is obscured by table row, that is, the table row below the bottom, so do not see the desired pop-up layer, which is jqgrid left the pit, After a few battles and struggles, I find that I need to set up CSS styles myself.

The solution is as follows:

A, add the attribute cellattr, its value is set to "Addcellattr", namely:

Cellattr:addcellattr

B, write the Addcellattr method event, as shown below:

Easy to copy, the code is as follows:

function Addcellattr (RowId, Val, rawobject, CM, rdata) {
	return "style= ' overflow:visible; '";
}

The effect of adding a good post-implementation is as follows: