<note tip>The entry about the datepicker can be found [[en:software:tim:smartform_basics#datepicker_calender|here]].</note>

======Changing the date's format in the datepicker======

With this javascript function you can change the date's format in your own datepicker

  * e.g. 01.01.2017
  * e.g. 01-01-2017

This is the format, which is used, when storing the values in the TIM database. This way you get a pretty format for [[en:software:tim:actionhandler:wordtemplatehandler|WordTemplates]], [[en:software:tim:mailnode|Mailnodes] etc.

Therefor a new datepicker has to be implemented in the custom.js, which overrides the one in TIM.

In the [[en:software:tim:smartform|Smartform]] we need, like with the normal datepicker, input field with a class. In this example the class **datefield** is used.

<code>
<form initMethod="initMyDateField">
<input type="text" name="myDateField" id="myDateField" class="datefield"/> Date
</form>
</code>

jQuery is required here and must be imported!

<code>
jq= (this.form.ownerDocument.defaultView!=null) ? this.form.ownerDocument.defaultView.jQuery : this.form.ownerDocument.parentWindow.jQuery;
</code>

In the custom file the datepicker is now being initialized in the function initMyDateField (name is freely selectable)

<code>
 gadget.functions.initMyDateField = function(){
     jq= (this.form.ownerDocument.defaultView!=null) ? this.form.ownerDocument.defaultView.jQuery : this.form.ownerDocument.parentWindow.jQuery;
     jq('.datefield').datepicker(jq.datepicker.regional["de"]);
 }
</code>

The datepicker can be given different regional formats. In this example "de" was given, which leads to: 31.07.2013

There are of course further formats available, all the way to naming the weekdays and months. Therefor you can look in the jQuery API for datepicker
([[http://api.jqueryui.com/datepicker/|http://api.jqueryui.com/datepicker/]]).