SOLVED

Restricting Date Field Value Ranges on Forms

Go to solution
Anonymous
Not applicable

Restricting Date Field Value Ranges on Forms

Is it possible via Forms 2.0 to restrict the field value ranges on the form?

I don't want potential leads to select weekends and specific dates such as today. I would like them to book a meeting at least a week out. Thanks!
0EM50000000Sy5B.jpg
All the best,
Andrew
Tags (1)
1 ACCEPTED SOLUTION

Accepted Solutions
SanfordWhiteman
Level 10 - Community Moderator

Re: Restricting Date Field Value Ranges on Forms

Without knowing it, you're actually asking two different questions, because Marketo uses two different ways of rendering Date fields. 

In Chrome, which supports input type=date, it's actually pretty easy to manipulate min/max date and other stuff.  I just put together an example here where the date has to be a week out.

In every other browser, though, you would have to use custom onValidate code. Alternately, you could think about wrapping the Marketo input in a third-party date-picker component.  This would require some restyling/destyling with CSS but I can't see offhand why you couldn't get it to work.  Luckily a Marketo form is an HTML <FORM> under the hood.

View solution in original post

4 REPLIES 4
SanfordWhiteman
Level 10 - Community Moderator

Re: Restricting Date Field Value Ranges on Forms

Without knowing it, you're actually asking two different questions, because Marketo uses two different ways of rendering Date fields. 

In Chrome, which supports input type=date, it's actually pretty easy to manipulate min/max date and other stuff.  I just put together an example here where the date has to be a week out.

In every other browser, though, you would have to use custom onValidate code. Alternately, you could think about wrapping the Marketo input in a third-party date-picker component.  This would require some restyling/destyling with CSS but I can't see offhand why you couldn't get it to work.  Luckily a Marketo form is an HTML <FORM> under the hood.

View solution in original post

Anonymous
Not applicable

Re: Restricting Date Field Value Ranges on Forms

Hello Sanford,

Thanks for the excellent response! Would you mind providing an example of the custom onValidate code and how to make the code dynamic per each browser? 

-Andrew

SanfordWhiteman
Level 10 - Community Moderator

Re: Restricting Date Field Value Ranges on Forms

I wouldn't write your own onValidate code -- you'll just end up reinventing the datepicker!

Instead use a third-party datepicker widget, making sure it does what you need (weekends, dateranges, etc.).  Set the input to just text and the datepicker handles all the validation.  Here's an example using the Kalendae widget (one of hundreds, maybe thousands of widgets out there, but one I love) on a Marketo form: https://codepen.io/figureone/pen/abOovRO 

Anonymous
Not applicable

Re: Restricting Date Field Value Ranges on Forms

One last question. Since the datepicker is a third-party solution, how are you able to push its values to a Marketo custom field? Essentially, I want to token the values, so I can use them in an alert to our sales reps. I feel like I'm going to owe you a drink after this one:)