DEV Community

React JS Online training

rajesh on April 03, 2020

Visualpath is offering Job oriented React JS Online Training by certified professionals in Hyderabad. Join this course to learn react js from basic...

Read full post

Narendra Patel • Apr 15 '20

how to click radio button get value in React js
import React, { PureComponent } from 'react'
import { Segment, Button, Icon, Message, Form } from 'semantic-ui-react';
import { Field, FieldArray, reduxForm } from 'redux-form';
import _filter from 'lodash/filter'
import _includes from 'lodash/includes'
import MainBodyHeader from '../../Shared/MainbodyHeader';
import { Radio } from '../../Inputs';

class AddQuestion extends PureComponent {

    state = {
        type: ''
    }


renderselecttype(event) {
      this.setState({
       type: event.target.value
    });
  }


render() {
    console.log(this.state.type);

    return (
        <>
            <MainBodyHeader
                title={'Add Quiz Question'}
                hasIcon={false}
                search={true}
                placeholder={''}
            />
            <Segment className='maincontent'>
                <Segment>
                    <Form id="addquestion">
                    <h2>Course Name : <span className='faded-text'> On Boarding</span></h2>
                        <Form.Group>
                            &nbsp;&nbsp;
                            <label><b>Please Select Type</b></label><br />
                            <Field name='type' component={Radio}
                                label='Multiple Select' radioValue='multiple_select'
                                onClick={this.renderselecttype}
                            />
                            <Field name='type' component={Radio}
                                label='Single Select(truefalse)' radioValue='single_select'
                                onClick={this.renderselecttype}
                            />
                        </Form.Group>
                    </Form>
                </Segment>
            </Segment>
        </>
    )
}

}
const formWrapperStep = reduxForm({
form: 'addquestion',
})(AddQuestion)

export default formWrapperStep;

Vicente G. Reyes • Apr 3 '20

Hi, could you please post more context on this article? Thanks.