Date format request for inputting dates

Gravity Support Forums » Plugin Support » Gravity Forms

greenfrog
Member

I have a client in the tourist industry who'd like a pull-down date selector that gives day of week as well as date.

The drop-down day/date selection currently on the Qantas airlines website is an example of what he wants: http://www.qantas.com.au

It has one drop down for year-month, another for date-day

The reason this matters in this industry is because apparently a percentage of guests manage to select the wrong date, even though they know the correct day of their travel, (presumably they misread a calendar - or don't bother to use one).

Is there any way Gravity Forms can be set up to run a date selector like this?

Posted 10 years ago on Wednesday June 5, 2013 | Permalink
David Peralty

We don't have a way of doing this by default in Gravity Forms. It would require custom coding. We use the JQuery date picker - http://jqueryui.com/datepicker/#date-formats You could attach the datepicker to an input field and use the Date Formats to change how it works. It wouldn't be exactly the same, but they do include a format DD, d MM yy that would include the day of the week.

Posted 10 years ago on Wednesday June 5, 2013 | Permalink
greenfrog
Member

David - thanks for the reply.

I'd be interested in having a go at what you suggest.. but don't know how to set about it. Is there any suggested reading that might give me a start?

Posted 10 years ago on Saturday June 8, 2013 | Permalink
greenfrog
Member

I took a look at the documentation you suggested David.

This presentation would satisfy my client's basic requirements:

http://jqueryui.com/datepicker/#alt-field

Is there any way to display that style of output easily?

Posted 10 years ago on Friday June 21, 2013 | Permalink
David Peralty
Add two text fields to your form. Give them CSS Classes so you can hook into the fields. Then in the JavaScript in your header.php file use the classes of those two fields to hook it in:
```
<script>
  $(function() {
    $( ".datepicker" ).datepicker({
      altField: ".alternate",
      altFormat: "DD, d MM, yy"
    });
  });
  </script>
```
Posted 10 years ago on Friday June 21, 2013 | Permalink