Home > Web Front-end > JS Tutorial > body text

jquery implements table paging and sorting

php中世界最好的语言
Release: 2018-04-26 15:54:31
Original
1872 people have browsed it

This time I will bring you jquery to implement table paging and sorting. What are the precautions for jquery to implement table paging and sorting? . The following is a practical case, let's take a look.

Use the jQuery extension to implement table paging and sorting. When using this extension, you must add the header and tags, because I use to perform paging. If thead is not added, the table header will also be used as a row in paging calculation.

<script language="
javascript
" type="text/javascript"> 
$("#myTable").tablePaging({ pageSize: 5, sorting: true, sortSelector: ".js-Order", sortType: "number" }); 
</script>
Copy after login

If you only use the paging function: $("#myTable").tablePaging();
Parameter description:

id: jQuery(this).attr(&#39;id&#39;), // 要分页的表格的ID 
pageSize: 10, // 单个页面显示记录数,默认是10条 
sorting: false,//是否要进行排序,默认不排序 
sort
Direction
: &#39;asc&#39;, //排序顺序,默认升序 
sortSelector: &#39;&#39;,//排序选择的列,这里需要给td设置一个class用来识别。可以从示例中看到演示 
sortType: &#39;&#39;, //排序支持的数字类型,‘number&#39;,‘string&#39;,‘date&#39; 
onPaged: null // 排完序之后绑定事件
Copy after login

Look at the paging Effect:
jquery implements table paging and sorting

# I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!

Recommended reading:

jquery and js directly call the elements in the iframe parent-child window (with code)

How jQuery calculates iframe window width and height

jquery operation multi-function table

The above is the detailed content of jquery implements table paging and sorting. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template