-2

Below is the date type form field I have in some form which renders on chrome correctly.

$form['date']['air_date'] = array (
  '#type' => 'date',
  '#title' => t('Air Date:'),
  '#required' => TRUE,
  '#default_value' => !empty($arr['air_date']) ? $arr['air_date'] : '',
);

enter image description here

But the same code gives me following error in console of safari browser and displays textfield instead of calendar -

TypeError: $context.find('input[data-drupal-date-format]').once is not a function. (In '$context.find('input[data-drupal-date-format]').once('datePicker')', '$context.find('input[data-drupal-date-format]').once' is undefined)

  • Is the line of code in the error code you wrote? – Jaypan Aug 20 at 10:24
  • Drupal gives me the above TypeError in console of safari browse – Vaibhav Gidde Aug 20 at 11:01
  • Did you write this code: $context.find('input[data-drupal-date-format]').once('datePicker')? – Jaypan Aug 20 at 11:08
  • No, this code is rendering from core files as I have used date form api.. – Vaibhav Gidde Aug 20 at 11:58
  • If you remove the code you showed,does the error remain? – Jaypan Aug 20 at 12:06
0

The below workaround helped me to achieve working date-picker in all browser.

    <script type="text/javascript">

      if ($('.form-date').prop('type') != "date"){ //if browser doesn't support input type="date", load files for jQuery UI Date Picker
        document.write('<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />\n')
        document.write('<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"><\/script>\n')
        document.write('<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"><\/script>\n')
      }
    </script>
    <script>
      jQuery(function($){ //on document.ready
        $('.form-date').datepicker({ dateFormat: 'yy-mm-dd' });
      })
    </script>

Also I have added custom placeholder to the date field as safari displaying text-field instead of date field. The typeError still exist in console but the above solution works for me in safari and other borwsers.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.