EasyUI Forum
October 16, 2025, 05:56:13 AM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: Need Documentation create element with javascript and react  (Read 12497 times)
spider58
Newbie
*
Posts: 32


View Profile
« on: December 04, 2018, 07:42:11 AM »

Hi,

I'm creating elements with javascript in react.

For example i need to modify a datagrid with,

hidden column
frozen column
button column
slider column

Some examples here but most of examples with no javascript.

for example;

how can i hide a column, (i tried hidden: true doesn't worked)
how can i add a slider in column

with javascript and react?

Thanks.
Logged
jarry
Administrator
Hero Member
*****
Posts: 2300


View Profile Email
« Reply #1 on: December 04, 2018, 07:24:04 PM »

With this code you can create a DataGrid dynamically. Reset the 'columns' state to re-render the DataGrid.
Code:
<DataGrid data={this.state.data} style={{height:250}}>
  {
    this.state.columns.map((col,index) => (
      <GridColumn key={index} {...col}></GridColumn>
    ))
  }
</DataGrid>
Logged
spider58
Newbie
*
Posts: 32


View Profile
« Reply #2 on: December 04, 2018, 11:16:34 PM »

With this code you can create a DataGrid dynamically. Reset the 'columns' state to re-render the DataGrid.
Code:
<DataGrid data={this.state.data} style={{height:250}}>
  {
    this.state.columns.map((col,index) => (
      <GridColumn key={index} {...col}></GridColumn>
    ))
  }
</DataGrid>

Thanks for reply. Yes i already using this code i got it from sample react nested grid code.

defining columns in state

Code:
columns: [
      {
               field: 'id',
               title: 'userid',
               hidden: true ----------->>>> doesnt worked
        }
      {
               field: 'name',
               title: 'username',
               width: 200,
               formatter: function(value) { --------------------------------->>> formatter doesnt worked
                         return "<button>value</button>"
               }
        }
]

Logged
jarry
Administrator
Hero Member
*****
Posts: 2300


View Profile Email
« Reply #3 on: December 05, 2018, 12:07:18 AM »

The GridColumn has no 'hidden' and 'formatter' properties. Please define the 'render' function to render the body cell.
Code:
{field:'name',title:'Name',width:100,
  render: ({row})=>(
    <button>{row.name}</button>
  )
},

To hide a column, you must remove it from the 'columns' state.

The GridColumn documentation is available from https://www.jeasyui.com/documentation5/GridColumn.php
Logged
spider58
Newbie
*
Posts: 32


View Profile
« Reply #4 on: December 06, 2018, 04:49:07 AM »

thanks
« Last Edit: December 06, 2018, 05:10:47 AM by spider58 » Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!