diff --git a/docs/basic-celledit.html b/docs/basic-celledit.html index 07b28fc..c71366a 100644 --- a/docs/basic-celledit.html +++ b/docs/basic-celledit.html @@ -5,7 +5,8 @@ nav.classList.toggle('docsSliderActive'); };

Cell Edit

react-bootstrap-table2 separate the cell edit code base to react-bootstrap-table2-editor, so there's a little bit different when you use cell edit than react-bootstrap-table. In the following, we are going to show you how to enable the cell edit

-

Live Demo For Cell Edit

+

Live Demo For Cell Edit
+API & Props Definition

Install

$ npm install react-bootstrap-table2-editor --save
diff --git a/docs/basic-column.html b/docs/basic-column.html
index 0956cbe..dc49051 100644
--- a/docs/basic-column.html
+++ b/docs/basic-column.html
@@ -6,7 +6,8 @@
           };

Work on Column

Firstly, legacy react-bootstrap-table is hard to customize the DOM Event, Attributes on column or header column. In the react-bootstrap-table2, we make those bad design become more easy and flexible.

Live Demo For Column
-Live Demo For Header Column

+Live Demo For Header Column
+API & Props Definition

Formatting Table Column

column.formatter is a good chance for you to customize the cell. If you just want to add some styling, attributes or DOM event linstener, react-bootstrap-table2 have respective props to handle:

diff --git a/docs/basic-filter.html b/docs/basic-filter.html index 3ddab49..632fbc6 100644 --- a/docs/basic-filter.html +++ b/docs/basic-filter.html @@ -5,7 +5,8 @@ nav.classList.toggle('docsSliderActive'); };

Column Filter

react-bootstrap-table2 separate the filter core code base to react-bootstrap-table2-filter, so there's a little bit different when you use column filter than react-bootstrap-table. In the following, we are going to show you how to enable the column filter:

-

Live Demo For Column Filter

+

Live Demo For Column Filter
+API & Props Definition

Install

$ npm install react-bootstrap-table2-filter --save
diff --git a/docs/basic-pagination.html b/docs/basic-pagination.html
index 96dcb0a..1cdc53f 100644
--- a/docs/basic-pagination.html
+++ b/docs/basic-pagination.html
@@ -5,7 +5,8 @@
             nav.classList.toggle('docsSliderActive');
           };

Pagination

react-bootstrap-table2 separate the pagination code base to react-bootstrap-table2-pagination, so there's a little bit different when you use pagination. In the following, we are going to show you how to enable and configure the a pagination table

-

Live Demo For Pagination

+

Live Demo For Pagination
+API & Props Definition

Install

$ npm install react-bootstrap-table2-pagination --save
diff --git a/docs/basic-remote.html b/docs/basic-remote.html
index 85cb8e2..76ff2ce 100644
--- a/docs/basic-remote.html
+++ b/docs/basic-remote.html
@@ -6,6 +6,7 @@
           };

Remote Table

What is Remote

By default, react-bootstrap-table2 always handle the data changes internally, such as sorting, paging, filtering etc. However, you may want to handle those logic or sync up to backend or Redux store so that remote can help you on it as well.

+

Live Demo for Remote Table

How

Make sure you already see remote props on BootstrapTable firstly. In the beginning, you can assign true to enable the remote mode on table but few people doing like that, because it will enable all the functionalities(sort, filter etc) become remote mode.

diff --git a/docs/basic-row-select.html b/docs/basic-row-select.html index bbf63f5..302a80d 100644 --- a/docs/basic-row-select.html +++ b/docs/basic-row-select.html @@ -5,7 +5,8 @@ nav.classList.toggle('docsSliderActive'); };

Row Selection

For the table row selection functionality, the usage is almost same as react-bootstrap-table. If you are a user from legacy react-bootstrap-table, you can consider to skip this part.

-

Live Demo For Row Selection

+

Live Demo For Row Selection
+API & Props Definition

Selection Mode

We support the single and multiple selection on table, config the selectRow.mode on BootstrapTable will enable the selection on the table.

diff --git a/docs/cell-edit-props.html b/docs/cell-edit-props.html index de20907..4bfa98a 100644 --- a/docs/cell-edit-props.html +++ b/docs/cell-edit-props.html @@ -1,10 +1,20 @@ -Cell Editing Props · react-bootstrap-table2

react-bootstrap-table2

Cell Editing Props

Following we list all props for cellEditFactory from react-bootstrap-table2-editor.

+
import cellEditFactory from 'react-bootstrap-table2-editor';
+
+const cellEdit = cellEditFactory({
+  mode: 'click',
+  ...
+});
+
+<BootstrapTable cellEdit={ cellEdit } ... />
+
+

Required

diff --git a/docs/pagination-props.html b/docs/pagination-props.html index 1ccd2d4..d8188b5 100644 --- a/docs/pagination-props.html +++ b/docs/pagination-props.html @@ -1,10 +1,20 @@ -Pagination Props · react-bootstrap-table2

react-bootstrap-table2

Pagination Props

Following we list all props for paginationFactory from react-bootstrap-table2-paginator.

+
import paginationFactory from 'react-bootstrap-table2-paginator';
+
+const pagination = paginationFactory({
+  page: 2,
+  ...
+});
+
+<BootstrapTable pagination={ pagination } ... />
+
+

Required

NONE

Optional

    diff --git a/docs/row-select-props.html b/docs/row-select-props.html index c267f26..f9d9387 100644 --- a/docs/row-select-props.html +++ b/docs/row-select-props.html @@ -1,10 +1,18 @@ -Row Selection Props · react-bootstrap-table2

    react-bootstrap-table2

    Row Selection Props

    Following we list all props for selectRow props

    +
    const selectRow = {
+  mode: 'checkbox',
+  ...
+});
+
+<BootstrapTable selectRow={ selectRow } ... />
+
    +

    Required