2

In advance, excuse my English!

I've been trying to understand for several hours why changing the locales setting don't work in my code. I would like to switch my calendar (from fullcalendar.io) in "Fr", so I put the right language .js file in a folder and tried to point my page on it.

Off, it does not take my modification in the code.

Do you have an idea or a track to propose to me?

I warn, I'm not necessarily really friend with the code in general even if I do the max ^^

Thank you!

Here's a part of my code:

<script src='./packages/core/locales/fr.js'></script>

  document.addEventListener('DOMContentLoaded', function() {
    var initialLocaleCode = 'fr';
    var localeSelectorEl = document.getElementById('locale-selector');
    var calendarEl = document.getElementById('calendar');

  var calendar = $('#calendar').fullCalendar({
      plugins: [ 'interaction', 'dayGrid', 'timeGrid', 'list' ],
      header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay,listMonth'
      },
      locale: initialLocaleCode,
      buttonIcons: false,
      weekNumbers: true,
      navLinks: true,
      editable: true,
      eventLimit: true, // allow "more" link when too many events
   events: "events.php",
Weiling
  • 41
  • 4
  • If you include the file correctly then there is no problem. Demo: https://codepen.io/ADyson82/pen/GRKygod?editors=1010 . I suggest the first thing you should do is check whether your fr.js file is actually being loaded into the browser correctly. Open your browser's Network tool (inside the Developer Tools) and then load the page containing your calendar. You should see it try to request "fr.js" and download it. If it fails for any reason, that could be the cause. Or maybe you have got some other error in the Console which is stopping it from working. Please debug as suggested, and let us know – ADyson Sep 05 '19 at 12:20
  • Actually though I just noticed something: I had assumed you are using fullCalendar v4 because of the `plugins` line which isn't used in v3. But now I look closely you are creating the calendar with `$('#calendar').fullCalendar({` which is v3 / jQuery syntax. You seem confused about the correct code to use. Which version of fullCalendar are you actually trying to use? v3 and v4 are [very different](https://fullcalendar.io/docs/v3#toc). – ADyson Sep 05 '19 at 12:28
  • As well as key things such as the way you initialise it and the use of plugins, another big change is the way you load locale files in [v4](https://fullcalendar.io/docs/locale) compared to [v3](https://fullcalendar.io/docs/v3/locale) – ADyson Sep 05 '19 at 12:29
  • In summary: choose a version, and stick to it. And then make sure you use the documentation and code examples which relate to that version. If you have a choice, choose v4 because it's newer, and will get features added, bugs fixed etc. whereas v3 will not. – ADyson Sep 05 '19 at 12:29
  • No problem. But please, instead of editing your question to include the solution, add it as an Answer, below. That way we can all vote on it. Also, logically, the solution is not part of the problem, so it does not belong within the question :-) – ADyson Sep 05 '19 at 12:57
  • I first edit my post because when I click on reply, it rather invited me to edit my post But, sure, will do it! First time i use StackOverflow, sry^^ – Weiling Sep 05 '19 at 13:03
  • Don't worry, that's why I mentioned it. We all have to learn at some time :-) – ADyson Sep 05 '19 at 13:06

2 Answers2

2

Edit with the fix:

I finally deleted everything and redo my php page with the right code from FullCalendar.

I think, as you said, have mixed code from an older version with that from a newer version. So I took the basic script from the site FullCalendar and delivered what interests me! 

  document.addEventListener('DOMContentLoaded', function() {
    var initialLocaleCode = 'fr';
    var localeSelectorEl = document.getElementById('locale-selector');
    var calendarEl = document.getElementById('calendar');

   var calendar = new FullCalendar.Calendar(calendarEl, {
      plugins: [ 'interaction', 'dayGrid', 'timeGrid', 'list' ],
      header: {
        left: 'prev,next today',
        center: 'title',
        right: 'dayGridMonth,timeGridWeek,timeGridDay,list'
      },
      locale: initialLocaleCode,
      buttonIcons: false,
      weekNumbers: true,
      navLinks: true,
      editable: true,
      eventLimit: true, // allow "more" link when too many events
      events: "events.php",

Thank you all for your help!

Weiling
  • 41
  • 4
1

May be you want to change the language in calendar.

Try:

lang: 'fr'

Be sure you have also inserted the right script for it. Arrange the path according to your folders:

 <script src='fullcalendar/lang-all.js'></script>
codemonkey
  • 809
  • 1
  • 9
  • 21
  • 2
    1) there's no such file as lang-all.js in fullCalendar v4, and 2) OP only needs French, so why download all the others? – ADyson Sep 05 '19 at 12:21
  • @ADyson perhaps the op is using the older version? – codemonkey Sep 05 '19 at 12:23
  • 1
    Actually you know something, you might be right, sorry. I had assumed v4 because of the `plugins` line which isn't used in v3. But now I look closely they initialise the calendar with `$('#calendar').fullCalendar({` which is v3 / jQuery syntax. So maybe they are getting confused between the two versions. But I think we need to clarify that with OP before we can suggest a definite solution – ADyson Sep 05 '19 at 12:25
  • 1
    Although I just checked and there's no still such file as lang-all even in v3: https://fullcalendar.io/docs/v3/locale. Maybe that's from v2 – ADyson Sep 05 '19 at 12:27
  • @ADyson to be honest, i have never used full-calendar in my life. I've just looked at the documentation and suggested it (I wasn't aware it was deprecated), you can feel right to downvote me :). But perhaps it is v2, who knows. – codemonkey Sep 05 '19 at 12:29
  • 1
    who knows? The documentation knows: https://fullcalendar.io/blog/2016/09/feature-packed-releases . lang- was changed to locale- in 3.0. I'd be surprised if OP was using v2, as it's fairly old. But you never know. – ADyson Sep 05 '19 at 12:30
  • @ADyson I mean who knows what version that op is using. – codemonkey Sep 05 '19 at 12:31
  • Indeed. That's why I've asked them to tell us. – ADyson Sep 05 '19 at 12:31
  • Indeed, i think i first use an older version and modify it with 'new' feature. That's the wrong way. I just did it again and it now works great! Thanks @ADyson – Weiling Sep 05 '19 at 12:50