Calendar Format - Angular, Vue, React, Web Components, Javascript, HTML5 Widgets

Tagged: calendar, culture, datetimeinput, jqxCalendar, jqxdatetimeinput, titleFormat

This topic contains 5 replies, has 2 voices, and was last updated by Nadezhda 9 years, 11 months ago.

Viewing 6 posts - 1 through 6 (of 6 total)

Author

Calendar Format Posts
February 17, 2015 at 7:06 am Calendar Format #67211

wayne
Participant

Hi,

Good Day!

Is it possible to change the format of the JP calendar?
The current format is 2月 2015 (mm/yyyy), can i change it to 2015 2月 (yyyy/mm)

And also the days are displayed in 月曜 instead of 月

Thanks.

February 17, 2015 at 9:51 am Calendar Format #67224
Nadezhda
Participant
Hello wayne,

Here is an example which shows how to change calendar format to JP calendar using ‘culture’ property. You can set the current format with ‘titleFormat’ property.
```
<!DOCTYPE html>
<html lang="en">
<head>
    <title ></title>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.11.1.min.js"></script>
    <script type="text/javascript" src="../../scripts/demos.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdatetimeinput.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcalendar.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxtooltip.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxlistbox.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdropdownlist.js"></script>
    <script type="text/javascript" src="../../jqwidgets/globalization/globalize.js"></script>
    <script type="text/javascript" src="../../jqwidgets/globalization/globalize.culture.ja-JP.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            // create a calendar.
            $("#jqxCalendar").jqxCalendar({ culture: 'ja-JP', width: '220px', height: '220px', enableTooltips: false, titleFormat: "MM yyyy" }); 
        });
    </script>
</head>
<body>
    <div style='float: left; margin-right: 20px;' id='jqxCalendar'></div>
</body>
</html>
```
Best Regards,
Nadezhda

jQWidgets team
http://www.jqwidgets.com/
February 17, 2015 at 10:34 am Calendar Format #67225

wayne
Participant

Hi Nadezhda,

Thanks for the example.

Is this also applicable to the jqxDateTimeInput?

February 17, 2015 at 11:28 am Calendar Format #67226

Nadezhda
Participant

Hi wayne,

You can set ‘culture’ property in jqxDateTimeInput, too. For more information, please, take a look at the following demo: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxdatetimeinput/localization.htm?arctic.

Best Regards,
Nadezhda

jQWidgets team
http://www.jqwidgets.com/

February 18, 2015 at 2:01 am Calendar Format #67278

wayne
Participant

Hi Nadezhda,

What I meant is that I wanted to have my calendar in this format.

https://www.google.com/url?sa=i&rct=j&q=&esrc=s&source=images&cd=&cad=rja&uact=8&ved=0CAcQjRw&url=https%3A%2F%2Ffiregoby.jp%2Farchives%2F2396&ei=nPPjVJ_gIOPtmQXO1YHgBQ&psig=AFQjCNGcZA9-nOIHLYtCo2gKvwLcMRtg3Q&ust=1424311113918255

Would this be possible?

Thanks.

February 18, 2015 at 1:10 pm Calendar Format #67314

Nadezhda
Participant

Hi wayne,

Unfortunately, it is not possible for this culture.

Best Regards,
Nadezhda

jQWidgets team
http://www.jqwidgets.com/
Author

Posts

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.