1, the implementation of the row of the move up, down,
Description
1.1 The table generated by the DataGrid has a fixed format, for example, the class name of the table div is datagrid-view. For example, each line TR has an ID and a Datagrid-row-index attribute.
1.2 After moving up and down, we will move the ID and Datagrid-row-index properties of the next two lines must also be interchangeable, so that the datagrid-row-index=0 line is sure to be
The page displays the first row of the table, =1 the second row, and so on. In the future, it is by taking this property value to find the data of a row.
1 function Move (isUp) {2 var selections = $dg. DataGrid (' Getselections ');3 if (selections.length = = 0) {4 return;5 }6 var $view = $ (' Div.datagrid-view ');7 var index = $dg. DataGrid (' Getrowindex ', selections[0]);8 var $row = $view. Find (' tr[datagrid-row-index= ' + index + '] ');9 if (isUp) {Ten $row. Each (function () { One var prev = $ (this). Prev (); A var previd = prev.attr (' id '); - var prevdatagridrowindex = prev.attr (' Datagrid-row-index '); - var Thisid = $ (this). attr (' id '); the var Thisdatagridrowindex = $ (this). attr (' Datagrid-row-index '); - prev.length && $ (this). InsertBefore (prev); - $ (this). attr (' id ', previd); - $ (this). attr (' Datagrid-row-index ', prevdatagridrowindex); + prev.attr (' id ', thisid); - prev.attr (' Datagrid-row-index ', thisdatagridrowindex); + }); A } else { at $row. Each (function () { - var next = $ (this). Next (); - var nextid = next.attr (' id '); - var nextdatagridrowindex = next.attr (' Datagrid-row-index '); - var Thisid = $ (this). attr (' id '); - var Thisdatagridrowindex = $ (this). attr (' Datagrid-row-index '); in next.length && $ (this). InsertAfter (next); - $ (this). attr (' id ', nextid); to $ (this). attr (' Datagrid-row-index ', nextdatagridrowindex); + next.attr (' id ', thisid); - next.attr (' Datagrid-row-index ', thisdatagridrowindex); the }); * } $}
2, save the results of the move
Note: Each TR contains several TD, each TD has a field attribute, which is the corresponding property name of the table display object, in the example GOODSID is the primary key of the product I want to show. Each TD contains a div, through layers
When find finds this div, it gets the value.
1 function NextStep () {2 var arraydata = $dg. DataGrid (' GetData '). Rows;3 var $view = $ (' Div.datagrid-view ');4 if (arraydata.length!=0) {5 saveids = ";6for (Var index=0;index<Arraydata. length;index++) {7 var goodsid= $view. Find (' tr[datagrid-row-index= '+ index + '] '). Find ("Td[field= ' goodsid '). Find (' div '). html ();8 Saveids += Goodsid;9 if (Index! )= arraydata.length-1) {Ten Saveids += ', '; One } A } - $.ajax ({ - URL: ' ${pagecontext.request.contextpath}/coupons/gettemplateid ', the type: ' Post ', - dataType: ' JSON ', - success:function (Result) { - window.location.href= "${pagecontext.request.contextpath}/coupons/tpl"+result+ "? Goodsid= "+saveids; + } - }); + } A }
jquery Easyui DataGrid implements a single line move up and down, and saves the moving result