NetTalk Central

NetTalk Web Server => Web Server - Share Knowledge => Topic started by: Bruce on December 08, 2009, 12:19:06 AM

Title: Customising the Date Lookup widget
Post by: Bruce on December 08, 2009, 12:19:06 AM
As you may know by now, NetTalk 5 uses jQuery. And jQuery has a very powerful Date Picker widget, which is now the date picker in NetTalk 5.

Some of the options in the DatePicker are supported directly by the template (the date limits for example) but most options have to be set in embed code. The goal of this post is to show how and where to put this embed code.


jQuery options documentation

http://jqueryui.com/demos/datepicker/#options (http://jqueryui.com/demos/datepicker/#options)
I'm not going to duplicate that documentation here, so feel free to go there and have a look at some of the options.

Setting options globally

The SitesQ has a new property, DateOptions. So this can be set either in the WebServer procedure, or (better) in the WebHandler procedure, in the ProcessLink method (before the parent call).

For example; (in web handler)
  self.site.dateoptions = 'numberOfMonths: 3'

Translations

One big use for setting options is non-english sites. for example;
Code: [Select]
Self.site.DateOptions = 'monthNames: [''Januarix'', ''Februarix'', ''Marchix'', ''Aprilix'', ''Mayix'', ''Juneix'', ''Julyix'', ''Augustix'', ''Septembix'', ''Octobix'', ''Novembix'', ''Decembix''], monthNamesShort: [''Jax'', ''Fix'', ''Max'', ''Apx'', ''Mix'', ''Jux'', ''Jix'', ''Aix'', ''Six'', ''Oix'', ''Nix'', ''Dix'']'
There's also options there for day names, first day of the week, and so on.

Date Picture

You can set the Date Picture for your site on the Web Server procedure, (General Tab) and also for each field individually as before. The one big difference is that it supports a lot more date pictures than NT4. As far as I know all date pictures supported by clarion (up to @D16) are supported.

Setting options locally

You can also set options specifically for each date lookup. This is useful if you want one (or more) date pickers to behave differently to the global default.

To do this, right-click on the procedure in question, and search for
.CreateDateInput
There's an embed point right before that call where you can set a variable called loc:options
you can either add to the global options as in...
Code: [Select]
loc:options = clip(p_web.site.DateOptions) & ',numberOfMonths: 3'or override it completely as in...
Code: [Select]
loc:options = 'numberOfMonths: 3'
Title: Re: Customising the Date Lookup widget
Post by: Alberto on December 11, 2009, 07:17:25 AM
Thanks Bruce,
FWIW here is the Spanish translation of mostly used datepicker porps :


Self.site.DateOptions = 'monthNames: [''Enero'', ''Febrero'', ''Marzo'', ''Abril'', ''Mayo'', ''Junio'', ''Julio'', ''Augosto'', ''Setiembre'', ''Octubre'', ''Noviembre'', ''Deciembre'']'&|
                        ',monthNamesShort: [''Ene'', ''Feb'', ''Mar'', ''Abr'', ''May'', ''Jun'', ''Jul'', ''Ago'', ''Set'', ''Oct'', ''Nov'', ''Dic'']'&|
                        ',dayNames: [''Domingo'', ''Lunes'', ''Martes'', ''Miercoles'', ''Jueves'', ''Viernes'', ''Sabado'']'&|
                        ',dayNamesMin: [''Do'', ''Lu'', ''Ma'', ''Mi'', ''Ju'', ''Vi'', ''Sa'']'&|
                        ',dayNamesShort: [''Dom'', ''Lun'', ''Mar'', ''Mie'', ''Jue'', ''Vie'', ''Sab'']'&|
                        ',closeText: ''Salir'''&|
                        ',currentText: ''Hoy'''&|
                        ',dateFormat: ''dd/mm/yy'''&|
                        ',nextText: ''Sig.'''&|
                        ',prevText: ''Ant.'''&|
                        ''

Cheers
Alberto
Title: Re: Customising the Date Lookup widget
Post by: Poul Jensen on September 24, 2013, 01:54:50 PM
And in Danish for those interested:

Self.site.DateOptions = '' & |
      'monthNames: [''Januar'', ''Februar'', ''Marts'', ''April'', ''Maj'', ''Juni'', ''Juli'', ''August'', ''September'', ''Oktober'', ''November'', ''December'']' &|
      ',monthNamesShort: [''Jan'', ''Feb'', ''Mar'', ''Apr'', ''Maj'', ''Jun'', ''Jul'', ''Aug'', ''Sep'', ''Okt'', ''Nov'', ''Dec'']' &|
      ',dayNames: [''Søndag'', ''Mandag'', ''Tirsdag'', ''Onsdag'', ''Torsdag'', ''Fredag'', ''Lørdag'']' &|
      ',dayNamesMin: [''Sø'', ''Ma'', ''Ti'', ''On'', ''To'', ''Fr'', ''Lø'']' &|
      ',dayNamesShort: [''Søn'', ''Man'', ''Tir'', ''Ons'', ''Tor'', ''Fre'', ''Lør'']'  &|
      ',closeText: ''Luk'''  &|
      ',currentText: ''Idag'''  &|
      ',dateFormat: ''dd/mm/yy'''  &|
      ',nextText: ''Næste''' &|
      ',prevText: ''Forrige''' &|
      ',showWeek: ''true''' &|
      ',firstDay: 1'  &|
      ',numberOfMonths: 2'

Cheers,
/Poul
Title: Re: Customising the Date Lookup widget
Post by: walter.dasilva on September 18, 2014, 05:51:25 AM
And now in Brazilian Portuguese,

  Self.site.DateOptions = 'monthNames: [''Janeiro'', ''Fevereiro'', ''Março'', ''Abril'', ''Maio'', ''Junho'', ''Julho'', ''Agosto'', ''Setembro'', ''Outubro'', ''Novembro'', ''Dezembro'']'&|
                          ',monthNamesShort: [''Jan'', ''Fev'', ''Mar'', ''Abr'', ''Mai'', ''Jun'', ''Jul'', ''Ago'', ''Set'', ''Out'', ''Nov'', ''Dez'']'&|
                          ',dayNames: [''Domingo'', ''Segunda'', ''Terça'', ''Quarta'', ''Quinta'', ''Sexta'', ''Sábado'']'&|
                          ',dayNamesMin: [''Do'', ''Se'', ''Te'', ''Qa'', ''Qi'', ''Se'', ''Sá'']'&|
                          ',dayNamesShort: [''Dom'', ''Seg'', ''Ter'', ''Qua'', ''Qui'', ''Sex'', ''Sáb'']'&|
                          ',closeText: ''Sair'''&|
                          ',currentText: ''Hoje'''&|
                          ',dateFormat: ''dd/mm/yy'''&|
                          ',nextText: ''Pró.'''&|
                          ',prevText: ''Ant.'''&|
                          ''
                         
:D
Walter