Title: Datagrid Object colums doesn't affect by sort.
Post by: spider58 on December 10, 2018, 11:06:49 PM
Hi
I have a datagrid which has some object columns such as buttons and sliders.
[date, name, slider, buttons]
date and name columns are sortable, slider and buttons not.
I am changing some rows slider value and sorting columns by name or date. But sliders and buttons does not affecting by sort.
Title: Re: Datagrid Object colums doesn't affect by sort.
Post by: stworthy on December 10, 2018, 11:40:02 PM
Please show an example to demonstrate your issue.
Title: Re: Datagrid Object colums doesn't affect by sort.
Post by: spider58 on December 11, 2018, 12:29:34 AM
Please show an example to demonstrate your issue.
Add a name and slider column. Set data with 2 or more row Run project Change some rows slider value with mouse Sort columns by name with click mouse And you willl see slider columns doesn't changing their rows by sort. Example. İ changed 1st row slider value as 50 Third slider value as 25 Sorted grid. Rows changed but sliders not. İ'm still seeing 1st rows salider value as 50 and 3th slider value as 25 Do you have jsfiddle template for rc-easyui? İ can show sample.
Title: Re: Datagrid Object colums doesn't affect by sort.
Post by: stworthy on December 11, 2018, 01:32:24 AM
Look at this example, it works fine. import React from 'react'; import { DataGrid, GridColumn, Slider } from 'rc-easyui';
class App extends React.Component { constructor() { super(); this.state = { data: [ { name: 'name1', slider: 50 }, { name: 'name2', slider: 25 } ] } } render() { return ( <div> <DataGrid data={this.state.data} style={{ width: 600, height: 250 }}> <GridColumn field="name" title="Name" sortable></GridColumn> <GridColumn field="slider" title="Slider" render={({ row }) => ( <Slider value={row.slider} onChange={(value) => row.slider = value}></Slider> )} /> </DataGrid> </div> ); } }
export default App;
Title: Re: Datagrid Object colums doesn't affect by sort.
Post by: spider58 on December 11, 2018, 04:29:02 AM
Look at this example, it works fine. import React from 'react'; import { DataGrid, GridColumn, Slider } from 'rc-easyui';
class App extends React.Component { constructor() { super(); this.state = { data: [ { name: 'name1', slider: 50 }, { name: 'name2', slider: 25 } ] } } render() { return ( <div> <DataGrid data={this.state.data} style={{ width: 600, height: 250 }}> <GridColumn field="name" title="Name" sortable></GridColumn> <GridColumn field="slider" title="Slider" render={({ row }) => ( <Slider value={row.slider} onChange={(value) => row.slider = value}></Slider> )} /> </DataGrid> </div> ); } }
[code]export default App;
i found what is problem excatly We define a data column for slider and use data value for slider. othervise doesn't worked well. Is this normal? My data coming from an URL and it has no slider value. Please try with below code (not defined a data column for slider value) import React, { Component } from 'react'; import { DataGrid, GridColumn, Slider } from 'rc-easyui';
class Main extends Component { constructor() { super(); this.state = { data: [ { name: 'name1' }, { name: 'name2' }, ] } } render() {
return (
<div> <DataGrid data={this.state.data} style={{ width: 600, height: 250 }}> <GridColumn field="name" title="Name" sortable></GridColumn> <GridColumn field="slider" title="Slider" render={({ row }) => ( <Slider value={10}></Slider> )} /> </DataGrid> </div>
); } }
export default Main; or below code (defined slider solumn but doesn't applied it) import React, { Component } from 'react'; import { DataGrid, GridColumn, Slider } from 'rc-easyui';
class Main extends Component { constructor() { super(); this.state = { data: [ { name: 'name1', slider:50 }, { name: 'name2', slider:25 }, ] } } render() {
return (
<div> <DataGrid data={this.state.data} style={{ width: 600, height: 250 }}> <GridColumn field="name" title="Name" sortable></GridColumn> <GridColumn field="slider" title="Slider" render={({ row }) => ( <Slider value={10}></Slider> )} /> </DataGrid> </div>
); } }
export default Main; [/code]
|