example for #461

Author: AllenFang

examples/js/advance/demo.js

@@ -4,6 +4,7 @@ import EditTypeTable from './edit-type-table';
 import DataInsertTypeTable from './insert-type-table';
 import AutoRowKeyTable from './auto-rowkey-table';
 import ValidatorTable from './validator-table';
+import HideOnInsertTable from './hide-on-insert-table';
 
 import renderLinks from '../utils';
 
@@ -21,6 +22,11 @@ class Demo extends React.Component {
           { renderLinks('advance/insert-type-table.js') }
           <DataInsertTypeTable/>
         </Panel>
+        <Panel header={ 'Hide column on Insert Modal)' }>
+          { renderLinks('advance/hide-on-insert-table.js') }
+          <h5>This example hide the Job Name field in insert modal</h5>
+          <HideOnInsertTable/>
+        </Panel>
         <Panel header={ 'Auto RowKey on Data Insert Example' }>
           { renderLinks('advance/auto-rowkey-table.js') }
           <AutoRowKeyTable/>

examples/js/advance/hide-on-insert-table.js

@@ -0,0 +1,35 @@
+/* eslint max-len: 0 */
+import React from 'react';
+import { BootstrapTable, TableHeaderColumn } from 'react-bootstrap-table';
+
+
+const jobs = [];
+const jobTypes = [ 'A', 'B', 'C', 'D' ];
+
+function addJobs(quantity) {
+  const startId = jobs.length;
+  for (let i = 0; i < quantity; i++) {
+    const id = startId + i;
+    jobs.push({
+      id: id,
+      name: 'Item name ' + id,
+      type: 'B',
+      active: i % 2 === 0 ? 'Y' : 'N'
+    });
+  }
+}
+
+addJobs(5);
+
+export default class HideOnInsertTable extends React.Component {
+  render() {
+    return (
+      <BootstrapTable data={ jobs } insertRow={ true }>
+          <TableHeaderColumn dataField='id' isKey={ true } autovalue>Job ID</TableHeaderColumn>
+          <TableHeaderColumn dataField='name' hiddenOnInsert>Job Name</TableHeaderColumn>
+          <TableHeaderColumn dataField='type' editable={ { type: 'select', options: { values: jobTypes } } }>Job Type</TableHeaderColumn>
+          <TableHeaderColumn dataField='active' editable={ { type: 'checkbox', options: { values: 'Y:N' } } }>Active</TableHeaderColumn>
+      </BootstrapTable>
+    );
+  }
+}