mohiit1502/ag-grid-react-example
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update fw examples

Browse Source
This commit is contained in:
Sean Landsman
2018-09-04 17:07:32 +01:00
parent 168a127e51
commit f5c1a4ba17
1 changed files with 12 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
src-examples/richGridDeclarativeExample/RichGridDeclarativeExample.jsx
View File

@@ -22,7 +22,7 @@ export default class RichGridDeclarativeExample extends Component {
this.state = { this.state = {
quickFilterText: null, quickFilterText: null,
showToolPanel: false, sideBar: false,
rowData: new RowDataFactory().createRowData(), rowData: new RowDataFactory().createRowData(),
icons: { icons: {
columnRemoveFromGroup: '<i class="fa fa-remove"/>', columnRemoveFromGroup: '<i class="fa fa-remove"/>',
@@ -50,8 +50,8 @@ export default class RichGridDeclarativeExample extends Component {
}; };
/* Demo related methods */ /* Demo related methods */
onToggleToolPanel = (event) => { onToggleSidebar = (event) => {
this.setState({showToolPanel: event.target.checked}); this.setState({sideBar: event.target.checked});
}; };
deselectAll() { deselectAll() {
@@ -142,8 +142,8 @@ export default class RichGridDeclarativeExample extends Component {
<div style={{display: "inline-block", width: "100%", marginTop: 10, marginBottom: 10}}> <div style={{display: "inline-block", width: "100%", marginTop: 10, marginBottom: 10}}>
<div style={{float: "left"}}> <div style={{float: "left"}}>
<label> <label>
<input type="checkbox" onChange={this.onToggleToolPanel} style={{marginRight: 5}}/> <input type="checkbox" onChange={this.onToggleSidebar} style={{marginRight: 5}}/>
Show Tool Panel Show Side Bar
</label> </label>
</div> </div>
<div style={{float: "left", marginLeft: 20}}> <div style={{float: "left", marginLeft: 20}}>
@@ -169,7 +169,7 @@ export default class RichGridDeclarativeExample extends Component {
onCellClicked={this.onCellClicked} onCellClicked={this.onCellClicked}
// binding to simple properties // binding to simple properties
showToolPanel={this.state.showToolPanel} sideBar={this.state.sideBar}
quickFilterText={this.state.quickFilterText} quickFilterText={this.state.quickFilterText}
// binding to an object property // binding to an object property
@@ -247,10 +247,10 @@ export default class RichGridDeclarativeExample extends Component {
All All
Rows Rows
(expand the Employee column to show the Country column first)</p> (expand the Employee column to show the Country column first)</p>
<p><span style={{fontWeight: 500}}>Toggle The Tool Panel</span>: Let your users Pivot, <p><span style={{fontWeight: 500}}>Toggle The Side Bar</span>: Let your users Pivot,
Group Group
and and
Aggregate using the Tool Panel</p> Aggregate using the Side Bar</p>
<p><span style={{fontWeight: 500}}>Refresh Data</span>: Dynamically Update Grid Data</p> <p><span style={{fontWeight: 500}}>Refresh Data</span>: Dynamically Update Grid Data</p>
<p><span style={{fontWeight: 500}}>Quick Filter</span>: Perform Quick Grid Wide <p><span style={{fontWeight: 500}}>Quick Filter</span>: Perform Quick Grid Wide
Filtering Filtering
@@ -322,12 +322,11 @@ export default class RichGridDeclarativeExample extends Component {
<div className="col-sm-4"> <div className="col-sm-4">
<div className="card"> <div className="card">
<div className="card-body"> <div className="card-body">
<h4 className="card-title">Tool Panel</h4> <h4 className="card-title">Side Bar</h4>
<p className="card-text">Let your users Pivot, Group and Aggregate using the <p className="card-text">Let your users Pivot, Group and Aggregate using the
Tool Side Bar</p>
Panel</p> <a target="_blank" href="https://www.ag-grid.com//javascript-grid-side-bar/"
<a target="_blank" href="https://www.ag-grid.com//javascript-grid-tool-panel/" className="btn btn-primary">Side Bar</a>
className="btn btn-primary">Tool Panel</a>
</div> </div>
</div> </div>
</div> </div>