WHY SUNDAY? please support me community!

API & Customization Ask Developers
1

When you select a date, in all calendar popups the week starts with Sunday, and you would have to allow the week to start on Monday. I don't know if this system is common in the USA, but in Europe the weeks start on Monday. :)!
Please support me because when we quickly mark a date we sometimes make mistakes for this reason. I've seen that since 2015 other people have asked for it but it still hasn't changed.

3 Likes
2

Hey Marc,

Here’s a solution I came up with. It intercepts Knack’s calls to jQuery datepicker and adds the firstDay option that controls which day of the week is displayed first.

Simply add the following code to your app’s JS:

(() => {
  const jqDatepicker = Knack.$.fn.datepicker;
  Knack.$.fn.datepicker = function(options) {
    return jqDatepicker.call(this, {
      ...options,
      firstDay: 1,
    });
  };
})();
3

Actually, a more elegant solution would actually be to just add the following to the top of your JS:

$.datepicker.setDefaults({ firstDay: 1 });
4 Likes
4

Fantastic David!! (if I am not mistaken on your identity)

1 Like
5

Thank you very much HMND, I have tested and it works perfectly. Your code is elegant and does what it wants. I’ve been lucky to have your help.

6

By the way, can you think of a way to change the language of the calendar? I would like it in Spanish, because the months and days (acronyms) appear in English. Thanks a lot.

1 Like
7

To set all relevant datepicker settings to those of the Spanish locale, you can use this:

// Set first day of week in datepicker to Monday
(() => {
  $.datepicker.regional['es'] = {
    closeText: 'Cerrar',
    prevText: '<Ant',
    nextText: 'Sig>',
    currentText: 'Hoy',
    monthNames: ['Enero','Febrero','Marzo','Abril','Mayo','Junio',
    'Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre'],
    monthNamesShort: ['Ene','Feb','Mar','Abr','May','Jun',
    'Jul','Ago','Sep','Oct','Nov','Dic'],
    dayNames: ['Domingo','Lunes','Martes','Miércoles','Jueves','Viernes','Sábado'],
    dayNamesShort: ['Dom','Lun','Mar','Mié','Juv','Vie','Sáb'],
    dayNamesMin: ['Do','Lu','Ma','Mi','Ju','Vi','Sá'],
    weekHeader: 'Sm',
    dateFormat: 'dd/mm/yy',
    firstDay: 1,
    isRTL: false,
    showMonthAfterYear: false,
    yearSuffix: ''};
  $.datepicker.setDefaults($.datepicker.regional['es']);
})();

Others can use this for their own locales, too. Simply find your locale in the GitHub repo and replace the contents of $.datepicker.regional and $.datepicker.setDefaults with those from your locale’s file.

3 Likes
8

works PERFECT David!! I have my App in 3 languages: spanish, french and english.

great!

9

Thank you very much David!! it works perfectly. :clap: :clap:

10

Hi, It is not working for me. I just put this code into javascript page. Any idea?
Thanks, Pablo.

11

Hi @Pablo1, it’s still working on my end. Are you using the exact code from the example? Is it having any effect on the date picker, or none at all?

12

hi, none at all. I have used your js .
Nothing happens … see this example. Knack

13

@Pablo1 Here’s what I’m seeing:

Screenshot_20220409-072221~2
Screenshot_20220409-072221~21080×2186 122 KB

Are you trying to do something else?

14

upps, sorry, now run perfect.

Btw, related to datepicker, do you know any good alternative/solution to admin from/to dates.
I mean, select the date range just from one calendar, (different to the date std with the flag" Yes, add options like repeat and end-time to use with a calendar. ".)

thanks again. Pablo.