Beginners Learn jquery Easyui---DataGrid right-click menu

recently learning jquery Easyui, now say the Easyui of the DataGrid, generally when we implement the front-end interface, often in the DataGrid

The above or behind add some buttons, convenient for users to add, delete, edit and other functions

in each use, the user needs to select one or more data, and then go to the Point button to do the relevant operations, which is actually very troublesome

, in the process of doing the project, for the sake of the user, made a right-click menu, the user wants to delete or edit a piece of data directly in its location right-click

just you can. The following code:

HTML Code

<div id= "Menu" class= "Easyui-menu" style= "width:30px; Display:none; " >      <!--Place a hidden menu div-->      <div id= "Btn_delete" data-options= "iconcls: ' Icon-remove '" onclick= "" > Delete </div>      <!--specific menu events Please add it yourself, the method with toolbar is basically the same--      <div id= "btn_modify" data-options= " Iconcls: ' Icon-edit ' > Edit </div> </div>

Here's the code for JavaScript

DataGrid Right-click menu code: $ ("#dg"). DataGrid ({    onrowcontextmenu:function (E, RowIndex, rowdata) {//Right-triggered event        // Three parameters: E inside a lot of content, really do not understand, rowindex is the current click on the index of the line, rowdata the current row of data        e.preventdefault ();//prevent the browser from capturing right-click event        $ (this). DataGrid ("Clearselections"); Cancels all selected items        $ (this). DataGrid ("SelectRow", rowIndex);//Select the row        $ (' #menu ') according to the Index. Menu (' show ', {            //Display right-click menu            left:e.pagex,//Show Menu Top:e.pagey} at mouse            click        );        E.preventdefault ();  Prevent browser from bringing up the right-click menu Popup    });

Here is the effect after the implementation:

Now just a simple implementation of the right-click menu, and later there will be improvements. What we do out of the end is to give the user to use, for the sake of the user,

How to let the user comfortable, in the user unexpected time, to help users complete the work they want to complete, this is the biggest success of this software!

Beginners Learn jquery Easyui---DataGrid right-click menu