Convert datatables Chinese API -- Basic parameters

Source: Internet
Author: User

Since I have been using datatables, I found this is a good table plug-in, but the good stuff is in English, so I combined my experience, let's make a simple translation of the English API on the official website. We also hope that you can share your experience with us so that we can better use datatables. This post will be updated continuously ......
Start with basic attributes.
Bautowidth:Enable or disable auto column width calculation.

Default Value True
Type Boolean
    1. $ (Document). Ready (function (){
    2. $ ('# Example'). datatable ({
    3. "Bautowidth": false // when disabled, the table will not automatically calculate the table size. When the browser is scaled down
    4. });
    5. });

CopyCode

Bdeferrender: According to the introduction on the official website, the translation is: Deferred rendering, there can be a speed improvement, when the datatable uses Ajax or JS source table data. This option is set to true, which causes the datatable to postpone the creation of each element of the table element until they are created. The purpose of this parameter is to save a lot of time.

Default Value: False
Type: Boolean
    1. $ (Document). Ready (function (){
    2. VaR otable = $ ('# example'). datatable ({
    3. "Sajaxsource": "sources/arrays.txt ",
    4. "Bdeferrender": True // I have never used this parameter. Is it true? Please try it yourself.
    5. });
    6. });

Copy code

Bfilter
: This is easy to understand. enable or disable data filtering. The datatable filter is "intelligent", which allows users
Finally, multiple keywords are entered (separated by spaces) to match each row of data, even if they are not in the specified Order (this allows matching multiple columns ). Note: If you want to use filter
It must be set to true. To delete the default filter input box and retain the filter function, use {@ link datatable. defaults. sdom
}. The last sentence does not understand.

Default Value: True
Type: Boolean
    1. $ (Document). Ready (function (){
    2. $ ('# Example'). datatable ({
    3. "Bfilter": false
    4. });
    5. });

Copy code

Bjqueryui: Needless to say, you can understand it at a glance and enable the jquery UI style (you need to add the jquery style file on the page ).

Default Value: False
Type: Boolean
    1. $ (Document). Ready (function (){
    2. $ ('# Example'). datatable ({
    3. "Bjqueryui": True
    4. });
    5. });

Copy code

Blengthchange: Enable the drop-down menu for how many data entries are displayed on a page, allowing users to pull from the drop-down box (10, 25, 50, and 100). Note that pagination is required (bpaginate: true ).

Default Value: True
Type: Boolean
    1. $ (Document). Ready (function (){
    2. $ ('# Example'). datatable ({
    3. "Blengthchange": false,

Copy code

Bpaginate: Enable the paging function. If not enabled, all pages will be displayed.

Default Value: True
Type: Boolean
    1. $ (Document). Ready (function (){
    2. $ ('# Example'). datatable ({
    3. "Bpaginate": false
    4. });
    5. });

Copy code

Bprocessing: Loading is displayed when Server Data Reading is enabled ...... It is better to enable this function, especially when the data volume is large.

Default Value: False
Type: Boolean
    1. $ (Document). Ready (function (){
    2. $ ('# Example'). datatable ({
    3. "Bprocessing": True
    4. });
    5. });

Copy code

Bscrollinfinite:Whether to enable a scroll bar with no length limit (used in combination with the sscrolly attribute). A scroll bar with no length limit means that the datatable will continuously load data when you drag the scroll bar.When the dataset is very large, it may be helpful. This option cannot be used with the paging option at the same time, and the paging option will be automatically disabled. Note that the recommended scroll bar will give priority to this option.

Default Value: False
Type: Boolean
    1. $ (Document). Ready (function (){
    2. $ ('# Example'). datatable ({
    3. "Bscrollinfinite": True,
    4. "Bscrollcollapse": True,
    5. "Sscrolly": "200px" // 200 pixels long
    6. });
    7. });

Copy code

Bserverside

: Enable the server mode and use the server side to process and configure the able. Note: The sajaxsource parameter must also be given to the datatableSource codeTo obtain the required
Data for each painting. This translation is awkward. After enabling this mode, you can perform operations on datatables
The number of records, next page, Previous Page, sorting (header), and search displayed on each page will be sent to the server.

Default Value: False
Type: Boolean
    1. $ (Document). Ready (function (){
    2. $ ('# Example'). datatable ({
    3. "Bserverside": True,
    4. "Sajaxsource": "xhr. php"
    5. });
    6. });

Copy code

Binfo: Enables or disables table information display. This shows the information about the data, which is currently on the webpage, including information filtering data, if the behavior is executed. This parameter is required after bserverside configuration.

Default Value: True
Type: Boolean
    1. $ (Document). Ready (function (){
    2. $ ('# Example'). datatable ({
    3. "Binfo": false // if this parameter is not used in the background, an error is reported on the server page. It is said that this parameter contains all information about the table.
    4. });
    5. });

Copy code

Bsort: Enable the sorting function. Each column has the sorting function. If it is disabled, the sorting function will be invalid. You can also customize the sorting function. You can disable the "bsortable" option for sorting a single column.

Default Value: True
Type: Boolean
    1. $ (Document). Ready (function (){
    2. $ ('# Example'). datatable ({
    3. "Bsort": false
    4. });
    5. });

Copy code

Bsortclasses:Whether to add sorting_1, sorting_2, and sorting_3 classes to the column to be sorted. When this column is sorted, you can change its background color,This option will increase the execution time (when the class is removed and added) as a back-and-forth switching attribute ),You may want to disable this option when sorting large datasets.

Default Value: True
Type: Boolean
    1. $ (Document). Ready (function (){
    2. $ ('# Example'). datatable ({
    3. "Bsortclasses": false
    4. });
    5. });

Copy code

Bstatesave:Whether to enable status saving. When the option is enabled, a cookie is used to save the status of the information displayed in the table, such as paging information, display length, filtering, and sorting.In this way, when the end user reloads the page, the previous settings can be used.

Default Value: False
Type: Boolean
    1. $ (Document). Ready (function (){
    2. $ ('# Example'). datatable ({
    3. "Bstatesave": True
    4. });
    5. });

Copy code

Sscrollx:Whether to enable horizontal scrolling. You can enable this option when a table is too wide to be placed in a layout, or when the table has too many columns.To display a table in a horizontally scrolling view, this attribute can be set by CSS or a number (used as a pixel measure)

Default Value: Blank string-I. e. Disabled
Type: String
    1. $ (Document). Ready (function (){
    2. $ ('# Example'). datatable ({
    3. "Sscrollx": "100% ",
    4. "Bscrollcollapse": True
    5. });
    6. });

Copy code

Sscrolly:Whether to enable vertical scrolling. Vertical scrolling will drive the datatable to be set to a given length. Any data that overflows beyond the current view can be viewed through vertical scrolling.When a large amount of data is displayed in a small area, you can select a method in paging and vertical scrolling. This attribute can be set by CSS or a number (used as a pixel measure)

Default Value: Blank string-I. e. Disabled
Type: String
    1. $ (Document). Ready (function (){
    2. $ ('# Example'). datatable ({
    3. "Sscrolly": "200px ",
    4. "Bpaginate": false
    5. });
    6. });

Copy code

This section is complete. We recommend that you use Ctrl + F for search.

Favorite for query: original address: http://bbs.sailit.cn/forum.php? MoD = viewthread & tid = 21

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.