简体   繁体   中英

How to disable/restrict user to select future and current date in bootstrap datepicker?

Problem Statement:- I am using bootstrap datepicker in React JS. I have used type="date" for the date of birth and i do not want user to be able to select current or future dates. How can i do so?

Code:-

import React from "react";

export default function DatePicker() {
  return (
    <div>
      <div className="col-sm-4 col-md-3 col-lg-3 form-group required">
        <label className="control-label">Date of Birth : </label>
      </div>
      <div className="col-sm-7 offset-1 col-md-8 col-lg-8">
        <input
          className="text-uppercase input-group input-group-lg form-control"
          type="date"
          name="dob"
        />
      </div>
    </div>
  );
}

you can have properties of min and max , you have to set max value till today, so all future dates will be disabled to select by users,

<input
  name="Fecha_end" 
  id="Fecha_end"
  className="text-uppercase input-group input-group-lg form-control"
  type="text"
  name="dob"
  max= new Date().getFullYear()+'/'+(new Date().getMonth()+1)+'/'+new Date().getDate();
/>

full working example here, https://jsfiddle.net/hmLpfkts/1/

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM