Easyui datagrid custom operation Column

Use the formatter method to add operation links to each row of the Jquery easyui datagrid.

We all know that Jquery's EasyUI datagrid can be added and custom Toolbar,

In this way, select a row and select the corresponding button of the toolbar to operate the data in this row.

However, in actual projects, we may need to add some operation links behind each line, such as "modify", "delete", and "View. For example:

Step 1: Add a column in the datagrid row. The fieid points to the id (fieid: 'id '),

Format the column (formater: formater function) as follows:

<Th data-options = "field: 'id', width: 60, align: 'center', formatter: formatter"> operation </th>

Step 2: The formatter has three parameters:

Value: the value of the field, that is, fidid: 'id '.

RowData: Row data, which is the JSON data of a row.

RowIndex: Row Index, the Index of the current row.

Therefore, a formatting function is required, and only one simple response is required.

<Script type = "text/javascript"> function formattings (val, row, index) {return '<a href = "' + row [" ID "] + '"> modify </a>' ;}</script>