How to format date into Arabic with English numerals for date and year in JavaScript?

Question

I want the date to be formatted in the following format:

date: 2016-12-04 into الأحد، 4 ديسمبر، 2016

But I'm getting the following. The numbers are converted to Arabic numerals. I want the date and year in English numerals:

الأحد، ٤ ديسمبر، ٢٠١٦

I have used the following code to format the date to Arabic.

var date = new Date('2016-12-04');
options = {
           weekday: 'long',
           year: 'numeric',
           month: 'short',
           day: 'numeric',
          };
var dateString = date.toLocaleDateString('ar-SA', options);
alert(dateString);

Hope my answer below answers your question? – Mohsen Alyafei Feb 27 '22 at 07:21 — Mohsen Alyafei, Feb 27 '22 at 07:21

score 4 · Answer 1 · edited May 23 '17 at 11:45

Found a solution Date conversion and manipulation in javascript with Arabic months

My modified code to get my desired output is as follows.

var date = new Date('2016-12-04');
var months = ["يناير", "فبراير", "مارس", "إبريل", "مايو", "يونيو",
  "يوليو", "أغسطس", "سبتمبر", "أكتوبر", "نوفمبر", "ديسمبر"
];
var days = ["اﻷحد", "اﻷثنين", "الثلاثاء", "اﻷربعاء", "الخميس", "الجمعة", "السبت"];
var delDateString = days[date.getDay()] + ', ' + date.getDate() + ' ' + months[date.getMonth()] + ', ' + date.getFullYear();

console.log(delDateString); // Outputs اﻷحد, 4 ديسمبر, 2016

Note that `new Date('2016-12-04')` will parse the string as UTC, but your *get* methods are using local. Users in a timezone west of Greenwich will see a date for the previous day. — RobG, Nov 29 '16 at 07:05

score 4 · Answer 2 · answered Nov 17 '19 at 15:28

4

You can use this Locales to specify numbering system.

let date = newDate.toLocaleDateString('ar-EG-u-nu-latn',{weekday: 'long', year: 'numeric', month: 'short', day: 'numeric'});

also check this MDN link to know more about it

answered Nov 17 '19 at 15:28

Omar Abdelhady

1,528
4
19
31

1

Thank you so much ( Jazak Allah khairan ). – Muhamed Oct 24 '21 at 15:38

Mohsen Alyafei · Answer 3 · 2022-01-28T16:14:45.937

A better (safer) way to get the Hijri (Islamic) date in English Numerals (Western-Arabic Numbers) in javascript is NOT to use a specific country locale like "ar-SA" or "ar-TN" or "ar-EG"; but use the Intl.DateTimeFormat() constructor with the following Locale options:

The numbering system (nu) set to latn (i.e. Western-Arabic Numbers), and
Calendar type (ca) set to islamic, and
The language locale to ar

The Locale options can be passed as an array for multiple options: ["ar-u-ca-islamic","ar-u-nu-latn"]

or as one string : "ar-u-ca-islamic-nu-latn"

Here is an example code that will print today's Hijri (Islamic) date with Western-Arabic Numbers (English Numerals):

I have also included a table to give the list of all Arabic "ar" locales and the default outputs to see the difference between them with regards to the name of the months and the default number system.

let options = {day: 'numeric', month: 'long',weekday:'long',year:'numeric'};

// 1st method
let locales = ["ar-u-ca-islamic","ar-u-nu-latn"];
console.log(new Intl.DateTimeFormat(locales, options).format(Date.now()));

// 2nd method
locales = "ar-u-ca-islamic-nu-latn";
console.log(new Intl.DateTimeFormat(locales, options).format(Date.now()));

score 1 · Answer 4 · answered Sep 11 '21 at 04:50

1

To get the current hijri date in javascript, we can use Intl.DateTimeFormat

To get the arabic display :

new Intl.DateTimeFormat('ar-TN-u-ca-islamic', {day: 'numeric', month: 'long',weekday: 'long',year : 'numeric'}).format(Date.now());

the expected output :

السبت، 4 صفر 1443 هـ

https://medium.com/@Saf_Bes/get-today-hijri-date-in-javascript-90855d3cd45b

answered Sep 11 '21 at 04:50

Ali Seyfollahi

2,662
2
21
29

This uses the Arabic locale for Tunisia to get a western-Arabic number (English Numerals) which is dangerous because the locale spec may change. – Mohsen Alyafei Jan 28 '22 at 15:19
See alternative solution above for Islamic date in English Numerals. – Mohsen Alyafei Jan 28 '22 at 15:37

score 0 · Answer 5 · answered Nov 29 '16 at 18:52

0

Try 'ar-MA' (for Morocco) instead of 'ar-SA'.

answered Nov 29 '16 at 18:52

Sarmad

44
1

Should be a comment – George Kagan Nov 29 '16 at 18:57
Why should it be a comment? It's a valid answer: https://www.ibm.com/support/knowledgecenter/SSS28S_3.0.0/com.ibm.help.forms.doc/locale_spec/i_xfdl_r_formats_ar_MA.html – Sarmad Nov 30 '16 at 08:48
I tried the **ar_MA** locale, it showing the Arabic numeral in Google Chrome V48. But the same worked in Firefox. https://jsfiddle.net/daj2jm3p/3/ – Shebin Nov 30 '16 at 10:11

How to format date into Arabic with English numerals for date and year in JavaScript?

5 Answers5