Search
showing results for - "handler in react"
Lina
12 Jun 2018
1import React, { Component } from "react";
2
3class Form extends Component {
4  constructor() {
5    super();
6    this.state = {
7      username: "",
8      qty: "",
9    };
10  }
11
12  ChangeHandler = (e) => {
13    this.setState({ [e.target.name]: e.target.value });
14  };
15
16  submitHandler = (e) => {
17    e.preventDefault();
18    console.log(this.state);
19  };
20
21  render() {
22    return (
23      <form onSubmit={this.submitHandler}>
24        <label htmlFor="username"> Name: </label>
25        <input type="text" name="username" id="username" onChange={this.ChangeHandler}/>
26
27        <label htmlFor="qty"> Quantity: </label>
28        <input type="text" name="qty" id="qty" onChange={this.ChangeHandler} />
29
30        <button> Submit </button>
31      </form>
32    );
33  }
34}
35
36export default Form;
37
similar questions
handleclick reactevent handling in react documentationhow to use an event listener in a react js componentreact supported eventsreact bind function to componentreact type div onclickreact onclick typeonclick 3d 7b 28window open react jsreact event listenerhandle onchange reactreact event listhow to add a click handler in react jsevent listener in reactuse onchange with react selecthow to get value from onclick handler in reactonclick reactonclick on fragment reactreact onchange eventdiv onchange react
queries leading to this page
reactjs events handlerevent handler in reactjsreact documentation events handlerswhat are event handlers in reactwhat is event handler in reacthandler function reactreact creating event handlersevent handler jsxreact dom event handlersreact class component event handlerreact component handlersevent handler in reactreact component all handlershandlers in reacthandler in reacthandler function in jsxclass components event handlers reacthandler inside react class component work with event handler reactreact event handlerhow to define handler function reactevent handler reactevent handlers reacthandler functions in reactreact event handler referenceevent handler in react in jshandler event type reactclass based component react event handlerreact react event handler 3chtmldivelement 3eevent handler reacrhandler component in reactreact com handlersevent handlers in reactreact event handlers class components react event handlerhow to use handler in react component optionsreact component event handlerreact even handlerwhat are all of the react event handlersreact 40handlersreact handlershandler inside react class component eventevent handler in react class based on componenthow to use handler in react optionsreactjs event handlerevent handler in react jsevent handlersin reactobject handler reacthandler reacthandle event in reactreact event handlereact handlerhow to write handler functions in reactevent handler in ractevent handle reacteven handler reacthandle event reactevent handler react docsreact function component event handlerhandler in react