Question T11845
Visible to All Users

Bootstrap Date Picker - Switch language

created 3 years ago (modified 3 years ago)

[Ticket cloned from T11811: jQuery datepicker issue in Survey within a modal]

Thank you, Jane. Your support is very much appreciated.

Any suggestion on how we switch language on the bootstrap date picker within a survey? We are allowing the user to take the survey in one if three languages to start. We can simply use the survey.locale to set the appropriate language, but then how do we switch the language for the bootstrap datepicker so the months/weekdays show in correct language?

Answers approved by surveyjs Support

created 3 years ago

Hello Prashant,
As outlined in Bootstrap Datepicker documentation (I18N), you can use the language property to change a locale.

When the Bootstrap Datepicker is used as a custom survey question editor, you can handle this when you register a custom editor as follows:

  • Load a JavaScript library which contains required translations for Bootstrap Datepicker:
HTML
<script src="bootstrap-datepicker.XX.js" charset="UTF-8"></script>
  • In a custom widget's afterRender function, set the language option using the current survey's locale setting:
JavaScript
afterRender: function (question, el) { var $el = $(el).is(".widget-datepicker") ? $(el) : $(el).find(".widget-datepicker"); const options = { ... language: question.survey.locale };
  • Now, it is sufficient to specify the survey.locale property. A Bootstrap Datepicker will be translated as well.

Please test this example: https://plnkr.co/edit/dJhEasPV9907nBQq.

Let me know if you have any questions or require further assistance.