Users over-riding datepicker entry - causing fulfilment issues

andibuyz
Tourist
8 1 2

Hi,

I hope someone can help me. 

Using the MINIMAL theme...

We fulfil customer orders on the date they choose, we restrict the dates to exclude Sundays, public holidays etc

To gather their required delivery date I use datepicker and an input field (shown below):

<h3>Choose your Delivery / Collection date</h3>
<div>
<input required class="required" type='text' id='DelPickupDate' name="attributes[DelPickupDate]" value="{{ cart.attributes["DelPickupDate"] }}" placeholder='select a date' />
</div>

This works most of the time, however some customers have worked out they can just type a date in the field and this is generating orders we can't fulfil.

I have tried to block this using:

<h3>Choose your Delivery / Collection date</h3>
<div>
<input readonly="readonly" required class="required" type='text' id='DelPickupDate' name="attributes[DelPickupDate]" value="{{ cart.attributes["DelPickupDate"] }}" placeholder='select a date' />
</div>

BUT this is creating a new problem. When I use this code it does stop customers typing dates in HOWEVER now the 'required' validation no longer works and the cart page allows customer to move onto to checkout without entering any date - this is even worse for us.

 

Does anyone know how to block typed entry into my input field whilst also ensuring a date is selected before moving onto the checkout page?

 

Thankyou

 

Andy

 

0 Likes