User Tools

Site Tools


ra:oldfrontend

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
ra:oldfrontend [2018/11/15 12:44]
koubel
ra:oldfrontend [2018/12/04 15:03] (current)
koubel [React components]
Line 83: Line 83:
 See some react related tasks for more information and examples. See some react related tasks for more information and examples.
  
 +====== React components ======
 +Grid
 +
 +important props
 +  * rows - list of objects - rows. For columns, see later
 +  * updateHeightInModal - necessary for showing grid in modal
 +  * customRowSettings.customButtons - array for the settings for special row properties, mostly for popup menu
 +
 +<​code>​
 +<​DataGrid.Grid
 +            key={"​id"​}
 +            rows={this.workPlanStore.sewerCollections}
 +            showRowSelectionCheckbox={true}
 +            selectedRowKey={"​id"​}
 +            isLoading={false}
 +            showFilterRow={true}
 +            // list of rows necessary, without this, grid doesn'​t work either
 +            selectedRowValues={this.workPlanStore.selectedRowsIds.slice()}
 +            // necessary for show grid in modal
 +            updateHeightInModal={true}
 +            onRowsSelected={(x) => this.workPlanStore.setSelectedRows(x)}
 +            // settings for row popup menu which is available at the end of row on ... 
 +            customRowSettings={{
 +                visible: true,
 +                displayEdit:​ false,
 +                displayDelete:​ false,
 +                customButtons:​ [
 +                   { name: "​planning",​ title: localize("​sewerDrainGrid.planning"​),​ icon: ""​ },
 +                   { name: "​detail",​ title: localize("​sewerDrainGrid.workPlanDetail"​),​ icon: ""​ },
 +                ],
 +                handleButtonClick:​ this.handleRowButtonClick
 +            }}
 +            onRowsDeselected={(x) => this.workPlanStore.setDeselectedRows(x)}
 +        >
 +
 +        </​DataGrid.Grid>​
 +</​code>​
 +
 +Stores and observables
 ====== Internet Explorer Support ====== ====== Internet Explorer Support ======
  
ra/oldfrontend.1542282290.txt.gz · Last modified: 2018/11/15 12:44 by koubel