DEV Community: Abu2505

How to use the multi checkbox in reactjs

Abu2505 — Mon, 19 Oct 2020 07:58:41 +0000

Hii I am facing the issue with the below code, Please anyone help me with this...

this.state = {

categories: [
{id: 1, value: "item 1", description:"Test Categorey 1"},
{id: 2, value: "item 2", description:"Test Categorey 2"},
{id: 3, value: "item 3", description:"Test Categorey 3"},
{id: 4, value: "item 4", description:"Test Categorey 4"}
],
checkedItems: []
}
}

handleChangecheck = (event) => {
}

    <Step3 currentStep={this.state.currentStep} handleChange={this.handleChangecheck} items={this.state.categories} 
    checkedItems={this.state.checkedItems}/>

    <br/> <br/> 
    {this.previousButton()} {this.nextButton()} {this.finishButton()}
  </form>

------------------------component 2 ---------------

{this.props.items.map((d, i) => {

return

{d.value}

{d.description}

{}

})}

Multiselect Dropdown bind in react Js

Abu2505 — Wed, 14 Oct 2020 09:08:57 +0000

Can you please help me, someone, how to bind multiselect dropdown value in react js
const options = [
{ label: 'Item 1', value: 1, description:"Item description 1"},
{ label: 'Item 2', value: 2, description:"Item description 2"},
{ label: 'Item 3', value: 3, description:"Item description 3"},
{ label: 'Item 4', value: 4, description:"Item description 4"}
];

//Class Component
constructor(props) {
super(props)
this.state = {
currentStep: 1,

selectedoptions: []
}
}
handleChange = event => {
const {name, value} = event.target
this.setState({
[name]: value
})

}

function Step1(props) {
if (props.currentStep !== 1) {
return null
}
return(

                  </td>                      
              </tr>
          </tbody>
      </table>   
    </div>
  </React.Fragment>

);
}

React Js - Passing Setstate values to the Parent component

Abu2505 — Fri, 25 Sep 2020 09:07:50 +0000

Dear All,

Anyone, please help me with the below query...

I have initialized the state value and send it to the parent component and using the onClick event I am updating the state value, and that update state value not able to pass the parent component.

//Initalizing the state
state = {
itemId: data[0].id
}

// onclick event and to Updating state

handleclick = (id) => {
this.setState({itemId: id})
}

//Button Onclick
onClick={()=>{this.handleclick(data.id)}}>{data.Datavalue}

// Sending to the (Table)Parent component

// Table itemid={itemId}

Please help me, someone to resolve this.

Below screenshots for reference.

https://dev-to-uploads.s3.amazonaws.com/i/yajky99vtosf7j5qix6n.JPG

Thanks.