Date Validation - Prevent Editing Date Field to Later Date

[kpcollier]

I'm trying to prevent users from changing the End_Date_Time date field to a later date on tabular report inline edit.

In example, if End_Date_Time has a value of 09/06/2023, I don't want the user to be able to Inline Edit this field to a date that is later, such as 09/07/2023 and on.

I think I'm getting pretty close. I'm getting hung up on getting the current date value for the field to compare with. console.log shows "undefined" for the endDate variable (which should be the current value, not the updated value, of End_Date_Time). newDate is successfully getting the newly picked date for the update. Calcfield2 value is just the current value for End_Date_Time.

When changing var endDate to just the Calcfield2 value instead of using the div, it is giving me a long decimal number, such as 0.00924323521.

Any help would be appreciated.

<div id="endDate[@field:CG_ID]">[@calcfield:2]</div>

<script>

var nameOfField = "InlineEditEnd_Date_Time";
document.addEventListener('DOMSubtreeModified', function(){
  
        if(document.getElementsByName(nameOfField)[0]){
          
            document.getElementsByName(nameOfField)[0].addEventListener('change', function(){

                var newDate = document.getElementsByName(nameOfField)[0].value;
                var endDate = document.getElementById("endDate[@field:CG_ID]").value;
                  
                console.log("current date" + endDate);
                console.log("new date" + newDate);

                if(!newDate){
                    alert("You must enter in a date.");
                    document.getElementsByName(nameOfField)[0].value="";
                    document.getElementsByName(nameOfField)[0].focus();
                }
                
                if((newDate) > endDate){
                    alert("You cannot extend your End Date. Please delete the request and submit a new one.");
                    document.getElementsByName(nameOfField)[0].value= endDate;
                    document.getElementsByName(nameOfField)[0].focus();
                }
            });
        }
});

</script>

 

[SushiPizza]

Hi kpcollier,

I am not very knowledgeable in JavaScript, but I have a similar solution without using it. Maybe it will be useful.

Here are the steps:

1. Create two Date/Time Fields and one formula Field with the formula from this forum post :

 

2. Create a simple Trigger that will copy the Date on Insert to the other field

 

3. Include the Date_Editable Field on the report DataPage and the Date_onInsert in the Submission form

The error can be changed in the localization settings

I hope this is useful.

Regards,
SP

[kpcollier]

@SushiPizza, this is awesome! Thank you much!

[futurist]

Just to add, if you also wish to validate value entered in an input field to make sure that it follows this format: www.websitename.com

Then you can use this code:

 

<script type="text/javascript">

document.addEventListener('BeforeFormSubmit', function(event) {

var inputField = document.querySelector('#InsertRecordNameofField');

  const value = inputField.value;
  const regex = /^www\.[a-zA-Z0-9-]+\.[a-zA-Z]{2,}$/;

if (!regex.test(value)) {
event.preventDefault();
alert('Invalid Submission!');

} else {

document.form["caspioform"].submit();

}

});
</script>

Make sure to replace "NameofField" with the actual name of the field that you want to validate before submitting.