Breaking News: Grepper is joining You.com. Read the official announcement!

implement start end date react

chifarol answered on March 23, 2023 Popularity 3/10 Helpfulness 1/10

answer implement start end date react

implement start end date react

Comment

function App() {
  const [account, setAccount] = React.useState({
    startdate: "",
    enddate: "",
    reason: "",
    leavetype: "",
  });

  function handleChange(e) {
    const name = e.target.name;
    const value = e.target.value;
    // treat state as immutable!
    // you need to creaet a new object here
    // See https://stackoverflow.com/a/25333702/17487348 for how to create a property from a string in ES6
    setAccount({...account, [name]: value});
  }
  function Submit(e) {
    e.preventDefault();
    console.log(account);
  }
  return (
    <div>
      <fieldset>
        <form className="" method="post" onSubmit={Submit}>
          <legend>Your trip</legend>
          <label for="startdate">Start Date:</label>
          <input
            type="date"
            name="startdate"
            min={new Date().toISOString().split("T")[0]}
            onChange={handleChange}
            required
          />
          <label for="enddate">End Date:</label>
          <input
            type="date"
            name="enddate"
            disabled={account.startdate === "" ? true: false}
            min={account.startdate ? new Date(account.startdate).toISOString().split("T")[0]: ""}
            onChange={handleChange}
            required
          />
        </form>
      </fieldset>
    </div>
  );
}

Popularity 3/10 Helpfulness 1/10 Language javascript

Source: Grepper

Tags: date javascript

Link to this answer
Share Copy Link

Contributed on Mar 23 2023

chifarol

0 Answers Avg Quality 2/10

implement start end date react

Contents

More Related Answers

implement start end date react

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.