JavaScript UI Libraries & Blazor Components Suite – Smart UI › Forums › Data Grid › Unable to load data into grid. › Reply To: Unable to load data into grid.
<div>
<div>Below is my source code:</div>
<div></div>
<div>import * as React from ‘react’;</div>
<div>import AppPage from ‘common/layout/appPage’;</div>
<div>import { Grid, Smart } from ‘smart-webcomponents-react/grid’;</div>
<div>const ProjectCategoryPage = () => {</div>
<div> const dataSource = new Smart.DataAdapter({</div>
<div> dataSource: [</div>
<div> {</div>
<div> EmployeeID: 1,</div>
<div> FirstName: ‘Nancy’,</div>
<div> LastName: ‘Davolio’,</div>
<div> ReportsTo: 2,</div>
<div> Country: ‘USA’,</div>
<div> Title: ‘Sales Representative’,</div>
<div> HireDate: ‘1992-05-01 00:00:00’,</div>
<div> BirthDate: ‘1948-12-08 00:00:00’,</div>
<div> City: ‘Seattle’,</div>
<div> Address: ‘507 – 20th Ave. E.Apt. 2A’,</div>
<div> },</div>
<div> ],</div>
<div> keyDataField: ‘EmployeeID’,</div>
<div> parentDataField: ‘ReportsTo’,</div>
<div> id: ‘EmployeeID’,</div>
<div> dataFields: [</div>
<div> ‘EmployeeID: number’,</div>
<div> ‘ReportsTo: number’,</div>
<div> ‘FirstName: string’,</div>
<div> ‘LastName: string’,</div>
<div> ‘Country: string’,</div>
<div> ‘City: string’,</div>
<div> ‘Address: string’,</div>
<div> ‘Title: string’,</div>
<div> ‘HireDate: date’,</div>
<div> ‘BirthDate: date’,</div>
<div> ],</div>
<div> });</div>
<div> const columns = [</div>
<div> {</div>
<div> label: ‘First Name’,</div>
<div> dataField: ‘FirstName’,</div>
<div> width: 200,</div>
<div> },</div>
<div> ];</div>
<div> return (</div>
<div> <AppPage screen=”administration.projectCategory”></div>
<div> <div className=”col-12″></div>
<div> <Grid</div>
<div> id=”grid”</div>
<div> dataSource={dataSource}</div>
<div> columns={columns}</div>
<div> /></div>
<div> </div></div>
<div> </AppPage></div>
<div> );</div>
<div>};</div>
<div>export default ProjectCategoryPage;</div>
</div>