-
Dropdown Editor
+
Textarea Editor
(
+
+
+
+ )
+ },
+ {
+ dataField: 'df1',
+ isDummyField: true,
+ text: 'Action 1',
+ formatter: (cellContent, row) => {
+ if (row.inStock) {
+ return (
+
+ Available
+
+ );
+ }
+ return (
+
+ Backordered
+
+ );
+ }
+ },
+ {
+ dataField: 'df2',
+ isDummyField: true,
+ text: 'Action 2',
+ formatter: (cellContent, row) => {
+ if (row.inStock) {
+ return (
+
+ Available
+
+ );
+ }
+ return (
+
+ Backordered
+
+ );
+ }
+ }
+];
+
+const sourceCode = `\
+import BootstrapTable from 'react-bootstrap-table-next';
+
+const columns = [
+ {
+ dataField: 'id',
+ text: 'Product ID'
+ },
+ {
+ dataField: 'name',
+ text: 'Product Name'
+ },
+ {
+ dataField: 'price',
+ text: 'Product Price'
+ },
+ {
+ dataField: 'inStock',
+ text: 'In Stock',
+ formatter: (cellContent, row) => (
+
+
+
+ )
+ },
+ {
+ dataField: 'df1',
+ isDummyField: true,
+ text: 'Action 1',
+ formatter: (cellContent, row) => {
+ if (row.inStock) {
+ return (
+
+ Available
+
+ );
+ }
+ return (
+
+ Backordered
+
+ );
+ }
+ },
+ {
+ dataField: 'df2',
+ isDummyField: true,
+ text: 'Action 2',
+ formatter: (cellContent, row) => {
+ if (row.inStock) {
+ return (
+
+ Available
+
+ );
+ }
+ return (
+
+ Backordered
+
+ );
+ }
+ }
+];
+
+class ProductList extends React.Component {
+ constructor(props) {
+ super(props);
+ this.state = { products };
+ }
+
+ toggleInStock = () => {
+ let newProducts = [...this.state.products];
+ newProducts = newProducts.map((d) => {
+ if (d.id === 13) {
+ return {
+ ...d,
+ inStock: !d.inStock
+ };
+ }
+ return d;
+ });
+ this.setState(curr => ({ ...curr, products: newProducts }));
+ };
+
+ render() {
+ return (
+
+
Products
+
+
+
+ );
+ }
+}
+`;
+
+class ProductList extends React.Component {
+ constructor(props) {
+ super(props);
+ this.state = { products };
+ }
+
+ toggleInStock = () => {
+ let newProducts = [...this.state.products];
+ newProducts = newProducts.map((d) => {
+ if (d.id === 13) {
+ return {
+ ...d,
+ inStock: !d.inStock
+ };
+ }
+ return d;
+ });
+ this.setState(curr => ({ ...curr, products: newProducts }));
+ };
+
+ render() {
+ return (
+
+
Action 1 and Action 2 are dummy column
+
+
+ { sourceCode }
+
+ );
+ }
+}
+
+export default ProductList;
diff --git a/packages/react-bootstrap-table2-example/examples/csv/export-custom-data.js b/packages/react-bootstrap-table2-example/examples/csv/export-custom-data.js
new file mode 100644
index 0000000..50da9b7
--- /dev/null
+++ b/packages/react-bootstrap-table2-example/examples/csv/export-custom-data.js
@@ -0,0 +1,98 @@
+/* eslint react/prop-types: 0 */
+import React from 'react';
+
+import BootstrapTable from 'react-bootstrap-table-next';
+import ToolkitProvider from 'react-bootstrap-table2-toolkit';
+import Code from 'components/common/code-block';
+import { productsGenerator } from 'utils/common';
+
+const products = productsGenerator();
+
+const columns = [{
+ dataField: 'id',
+ text: 'Product ID'
+}, {
+ dataField: 'name',
+ text: 'Product Name'
+}, {
+ dataField: 'price',
+ text: 'Product Price'
+}];
+
+const sourceCode = `\
+import BootstrapTable from 'react-bootstrap-table-next';
+import ToolkitProvider from 'react-bootstrap-table2-toolkit';
+
+const columns = [{
+ dataField: 'id',
+ text: 'Product ID'
+}, {
+ dataField: 'name',
+ text: 'Product Name'
+}, {
+ dataField: 'price',
+ text: 'Product Price'
+}];
+
+const MyExportCSV = (props) => {
+ const handleClick = () => {
+ props.onExport();
+ };
+ return (
+
+
+
+ );
+};
+
+
+ {
+ props => (
+
+
+
+
+
+ )
+ }
+
+`;
+
+const MyExportCSV = (props) => {
+ const handleClick = () => {
+ // passing my custom data
+ props.onExport(products.filter(r => r.id > 2));
+ };
+ return (
+
+
+
+ );
+};
+
+export default () => (
+
+
+ {
+ props => (
+
+
+
+
+
+ )
+ }
+
+
{ sourceCode }
+
+ Export CSV!!
+
+
+
+ )
+ }
+
+
+
+ {
+ props => (
+
+ Export CSV!!
+
+
+
+ )
+ }
+
+`;
+
+const selectRow = {
+ mode: 'checkbox',
+ clickToSelect: true
+};
+
+export default () => (
+
+
Export all selected row
+
+ {
+ props => (
+
+ Export CSV!!
+
+
+
+ )
+ }
+
+
Export all selected rows in currect visible rows
+
+ {
+ props => (
+
+ Export CSV!!
+
+
+
+ )
+ }
+
+
{ sourceCode }
+