Flat Data

Parent Previous Next

Flat data is basically a JavaScript array of JavaScript objects. imagine an array of objects like below

       

 <script type="text/javascript">

       class Example extends React.Component {


           constructor() {

               this.state = {

                   dataProvider: [

                       { "id": "5001", "type": "None" },

                       { "id": "5002", "type": "Glazed" },

                       { "id": "5005", "type": "Sugar" },

                       { "id": "5007", "type": "Powdered Sugar" },

                       { "id": "5006", "type": "Chocolate with Sprinkles" },

                       { "id": "5003", "type": "Chocolate" },

                       { "id": "5004", "type": "Maple" }

                   ]

               }

           }


           render() {

               return (

                   <ReactDataGrid id={"grid"} dataProvider={this.state.dataProvider} enablePrint enablePreferencePersistence

                    enableExport forcePagerRow pageSize="50" enableFilters enableFooters >

                       <ReactDataGridColumn dataField="id" headerText="ID" />

                       <ReactDataGridColumn dataField="type" headerText="Type"/>

                   </ReactDataGrid>

               );

           }

       }


   </script>


We have seen this in numerous examples so far where we supply a list of JavaScript objects via the provider parameter. You can also supply the same thing using the setDataProvider method.