Menu
I am trying to get my Forms Date Input to only allow Thursday, Friday, and Saturday to be selected. But I can't seem to find a way to do it.
Is there some JavaScript or HTML code I could use to solve this issue?
Here is my current code
import React from 'react';
const CustomForm = () => {
const addTwoWeeks = function () {
let today = new Date();
today.setDate(today.getDate() + 14);
let dd = today.getDate();
let mm = today.getMonth() + 1;
let yyyy = today.getFullYear();
if (dd < 10) {
dd = '0' + dd
}
if (mm < 10) {
mm = '0' + mm
}
today = yyyy + '-' + mm + '-' + dd;
return today;
}
return (
<form>
<label htmlFor="date">Pick-Up Date:</label>
<input type="date" id="date" name="date" min={addTwoWeeks()} required />
</form>
)
}
export default CustomForm;
751
asked Oct 26 '25 14:10
It's quite simple if you will use datepicker js
$("#datepicker").datepicker({
beforeShowDay: function (d) {
var day = d.getDay();
return [day != 0 && day != 1 && day != 2 && day != 3];
},
});
Full working example:
<html>
<head>
<title>HTML</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/themes/smoothness/jquery-ui.css" crossorigin="anonymous" referrerpolicy="no-referrer"/>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js" crossorigin="anonymous" referrerpolicy="no-referrer" ></script>
<script>
$(function () {
$("#datepicker").datepicker({
beforeShowDay: function (d) {
var day = d.getDay();
return [day != 0 && day != 1 && day != 2 && day != 3];
},
});
});
</script>
</head>
<body>
<input type="text" id="datepicker" />
</body>
</html>If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
