Disable the Submit button for the rest of the month and Enable it on the last 3 days of the month

[Arr2093]

Hello, 

I am new to caspio development & javascript .

I have created a simple submission form. Is it possible to enable the submit button only for the last three days of the month? (Because the user should be able to save their responses any day in a month but should be allowed to submit only during end of the month (preferably last 3 days)

My questions are:

1. How do I modify the following code to disable the submit button? (Need to replace console.log part of if-else with js code for disable & enable submit form)

2. Where do I add this javascript in Caspio?

3. Is there any other way to implement this feature?

This is the logic I intend to use:

var today = new Date();

var lastDayOfMonth = new Date(today.getFullYear(), today.getMonth()+1, 0);

var lastSecDayOfMonth = new Date(today.getFullYear(), today.getMonth()+1, -1);

var lastThirdDayOfMonth = new Date(today.getFullYear(), today.getMonth()+1, -2);

 

if ((today != lastDayOfMonth) || (today != lastSecDayOfMonth) || (today != lastThirdDayOfMonth)){

    console.log(`Today is not within last three days of month`)}

else {console.log(`Today is within last three days of month`);}

[PotatoMato]

Hello, @Arr2093.

 

1. You can also check this other post: 

 

2. You can insert custom codes like JavaScript on a Footer or HTML blocks. Make sure that the HTML editor is disabled before pasting your code: 

3. I think this is only possible using JS.

 

-Potato

[Arr2093]

Hello @PotatoMato

Thanks for sharing the link. Based on the link you shared I came up with the javascript as below and added it in the footer under Web Form Wizard - Configure Fields  section of the form.

1. When I click preview I see the javascript block in the forms page footer (refer to the attached screenshot) and the logic to disable the button does not seem to be working. Am I missing any steps here?

2. Is the below code correct (logic and syntax)? 

<script type="text/javascript">
var today = new Date();
var lastDayOfMonth = new Date(today.getFullYear(), today.getMonth()+1, 0);
var lastSecDayOfMonth = new Date(today.getFullYear(), today.getMonth()+1, -1);
var lastThirdDayOfMonth = new Date(today.getFullYear(), today.getMonth()+1, -2);
document.addEventListener('DataPageReady', function(event) {
document.querySelector("input[name='Submit']").disabled = true;
document.addEventListener('change', function(event) {
if((today != lastDayOfMonth) || (today != lastSecDayOfMonth) || (today != lastThirdDayOfMonth))
{
document.querySelector("input[name='Submit']").disabled = true;
}
else
{
document.querySelector("input[name='Submit']").disabled = false;
}
});
});
</script>

 

[PotatoMato]

Hi, @Arr2093.

 

1. It seems that you forgot to disable the HTML editor:

 

2. Can you try the code below:

<script type="text/javascript">
document.addEventListener('DataPageReady', function(event) {

  var today = new Date();
  var lastDayOfMonth = new Date(today.getFullYear(), today.getMonth() + 1, 0);
  var lastSecDayOfMonth = new Date(today.getFullYear(), today.getMonth() + 1, -1);
  var lastThirdDayOfMonth = new Date(today.getFullYear(), today.getMonth() + 1, -2);

  var submitButton = document.querySelector("input[name='Submit']");
  submitButton.disabled = true;

  if (
    today.getDate() === lastDayOfMonth.getDate() || today.getDate() === lastSecDayOfMonth.getDate() || today.getDate() === lastThirdDayOfMonth.getDate()
  ) {
    submitButton.disabled = false;
  }
});

</script>

 

Hope this helps.

 

-Potato

[Arr2093]

Hello @PotatoMato

Disabled the HTML editor and also used the script you shared. I still see same issue. 

[PotatoMato]

Hi @Arr2093, can you send screenshots of your datapage setup?

[Arr2093]

Hello @PotatoMato

I have attached the screenshots here.

[PotatoMato]

Hi @Arr2093, can you also include the configuration on your Footer?

[Arr2093]

Hello @PotatoMato

Attached here.

[PotatoMato]

Hi @Arr2093. Thank you. It seems that there are unnecessary characters in the code. Please try to remove all the code and paste the code again that I have provided.

 

It should look like this:

[Arr2093]

Hello @PotatoMato thanks a lot! 

I can now see the Submit button disabled. The logic seems to be working and even the HTML code is not displayed on the forms page.