O'Reilly logo

Learning Web Development with React and Bootstrap by Mehul Bhatt, Harmeet Singh

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Getting the form values on submit

As we've seen, the state and prop will give you the control to alter the value of the component and handle the state for that component.

OK, now let's add some advanced features in our Add Ticket form, which can validate the user input and display the tickets on the UI.

Ref attribute

React provides ref non-DOM attributes to access the component. The ref attribute can be a callback function and it will execute immediately after the component is mounted.

So we will attach the ref attribute in our form element to fetch the values:

var AddTicket = React.createClass({ handleSubmitEvent: function (event) { event.preventDefault(); console.log("Email--"+this.refs.email.value.trim()); console.log("Issue Type--"+this.refs.issueType.value.trim()); ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required