How to make an input box enable for only past dates and for the startdate if it falls in the current month and the current year?

How to make an input box enable for only past dates and for the startdate that if it falls in the current month in JavaScript.

The input box should be disabled for the future dates and for the startdate if it falls in the current month and the current year.

I have implemented the function but not sure the following logic will work for every scenario.

 const globalPendingStatusIDL3 = "76070";
            
const check_IsExternalUser_And_PendingStatusL3  = (statusID = null, startDate = null) => {
  const now = new Date();
  const today = new Date(Date.UTC(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate() ));  
  return !!statusID && !!startDate ? (statusID === "76070" && ((!(new Date(startDate)).getMonth() === new Date().getMonth() && new Date(startDate).getFullYear() === new Date().getFullYear()) || startDate.getTime() < today.getTime())) : false;
};

//Code where the input box is being created and disabled being set using a loop:
strHTML += "<td width=\"100px\"><input class=\"form-control target-form\" data-recordid=\"" + recordid + "\" data-oldvalue=\"" + actualValue + "\" id=\"txtActualValue_" + recordid + "\" data-prevrecordid=\"" + (prevrecordid == "" ? "" : ("txtActualValue_" + prevrecordid)) + "\" value=\"" + actualValue + "\"" + (globalIsStaff ? "" : (check_IsExternalUser_And_PendingStatusL3(statusID,startDate) === true ? "disabled" : "")) + "/></td>";

//Few scenarios and the desired result:
    check_IsExternalUser_And_PendingStatusL3("76070",new Date("2022-12-01")); //The input box should be enable
    check_IsExternalUser_And_PendingStatusL3("76070",new Date("2023-01-01")); //The input box should be enable
    check_IsExternalUser_And_PendingStatusL3("76070",new Date("2023-06-01")); //The input box should be disable
    check_IsExternalUser_And_PendingStatusL3("76070",new Date("2023-06-30")); //The input box should be disable
    check_IsExternalUser_And_PendingStatusL3("76070",new Date("2023-07-01")); //The input box should be disable
    check_IsExternalUser_And_PendingStatusL3("76070",new Date("2024-01-01")); //The input box should be disable

So… you’re using a standard text input box? I dont see any type defined in that input…
Why not type='date' and then use the actual attributes of a date input to specify the minimum date?

I just want to make sure that my function will work in every scenario, which will make the input box disabled.

const check_IsExternalUser_And_PendingStatusL3 = (statusID = null, startDate = null) => {
return !!statusID && !!startDate ? (statusID === “76070” && ((new Date(startDate)).getMonth() === new Date().getMonth() || startDate > new Date())) : false;
};

Well, we can clean that up a bit, at least… also, i’m going to use UTC functions, because you’re passing dates without timezone qualifiers…

const check_IsExternalUser_And_PendingStatusL3  = (statusID = null, startDate = null) => {
  startDate = new Date(startDate);
  let now = new Date();
  return statusID === "76070" && !(startDate.getUTCMonth() === now.getUTCMonth() && startDate.getUTCFullYear() === now.getUTCFullYear()) && startDate < now;
};
1 Like

Txs. It works. Appreciated.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.