Najlepszy samouczek jQuery EasyUI danych Siatka - Niestandardowe stronicowania W 2024 r. W tym samouczku możesz dowiedzieć się Pobierz przykłady jQuery EasyUI,
Siatka danych (DataGrid) zbudowany ładne karty funkcji, zwyczaj jest dość prosta. W tym tutorialu, będziemy tworzyć siatkę danych (datagrid), a na pasku narzędzi zakładki dodać kilka przycisków niestandardowych.
<Id Tabela = "tt" title = class "Dane obciążenia" = "easyui-DataGrid" style = "width: 550px; height: 250px" url = "data / datagrid_data.json" iconCls = "icon-save" stronicowanie = "true"> <THEAD> <Tr> <Pole Th = "itemid" width = "80"> Item ID </ th> <Pole Th = "productid" width = "80"> ID produktu </ th> <Th pole = "ListPrice" width = "80" align = "right"> Cennik </ th> <Pole Th = "unitcost" width = "80" align = "right"> jednostkowy koszt </ th> <Th pole = "attr1" width = "100"> Atrybut </ th> <Pole Th = "status" width = "60" align = "center"> Stauts </ th> </ Tr> </ THEAD> </ Table>
Pamiętaj, że ustawienie "stronicowanie" własność jest prawdą, będzie to generować pasek stronicowania.
var pager = $ ( '# tt') DataGrid ( "getPager ') ;. // dostać pager z DataGrid pager.pagination ({ showPageList: false, przyciski: [{ iconCls: "ikona-search" Handler: function () { alert ( 'szukaj'); } }, { iconCls: "icon-add" Handler: function () { alert ( "add"); } }, { iconCls: "ikona-edit" Handler: function () { alert ( 'edit'); } }], onBeforeRefresh: function () { alert ( "przed odświeżania '); return true; } });
Jak widać, mamy pierwsze siatki danych (datagrid) obiektu pagera, a następnie ponownie utworzyć stronę (stronicowania). Mamy ukryć listę stron i dodać trzy nowe przyciski.