تبدیل اعداد فارسی به انگلیسی

مشکل اعداد فارسی در فرم‌ها و سایت

کاربر ایرانی شماره موبایلش را با کیبورد فارسی تایپ می‌کند: ۰۹۱۲…. برای انسان فرقی ندارد، ولی برای کد، «۵» فارسی با «5» انگلیسی دو کاراکتر کاملاً متفاوت است. نتیجه این است که فرم ثبت‌نام خطای «شماره نامعتبر» می‌دهد، کد تأیید پیامکی قبول نمی‌شود و جستجوی سفارش با شماره پیدا نمی‌شود. بدتر اینکه بعضی گوشی‌ها رقم عربی (٤٥٦) تایپ می‌کنند که با فارسی هم فرق دارد.

تبدیل اعداد فارسی به انگلیسی در جاوااسکریپت

این تابع‌ها هم رقم فارسی و هم عربی را پوشش می‌دهند:

const toEn = (s) => s
  .replace(/[۰-۹]/g, (d) => '۰۱۲۳۴۵۶۷۸۹'.indexOf(d))
  .replace(/[٠-٩]/g, (d) => '٠١٢٣٤٥٦٧٨٩'.indexOf(d));

const toFa = (s) => String(s).replace(/\d/g, (d) => '۰۱۲۳۴۵۶۷۸۹'[d]);

// یا با Intl
new Intl.NumberFormat('fa-IR').format(1250000); // ۱٬۲۵۰٬۰۰۰

تبدیل در PHP

function to_en(string $s): string {
    return strtr($s, ['۰'=>'0','۱'=>'1','۲'=>'2','۳'=>'3','۴'=>'4','۵'=>'5','۶'=>'6','۷'=>'7','۸'=>'8','۹'=>'9',
                      '٠'=>'0','١'=>'1','٢'=>'2','٣'=>'3','٤'=>'4','٥'=>'5','٦'=>'6','٧'=>'7','٨'=>'8','٩'=>'9']);
}

بهترین کار این است که هم در مرورگر (برای تجربه‌ی بهتر) و هم در سرور (برای اطمینان) ورودی را نرمال کنی.

فیلد عددی درست در HTML

برای شماره موبایل و کد تأیید، این ویژگی‌ها کیبورد عددی را در گوشی باز می‌کنند و عدد را چپ‌به‌راست نشان می‌دهند:

<input type="tel" inputmode="numeric" dir="ltr" autocomplete="tel">

از type="number" برای شماره تلفن استفاده نکن؛ صفر اول را حذف می‌کند و فلش‌های کم و زیاد هم بی‌معنی است.

نمایش اعداد فارسی در سایت

برای نمایش، بهتر است عدد در دیتابیس انگلیسی بماند و فقط هنگام نمایش فارسی شود؛ با Intl.NumberFormat('fa-IR') یا فونتی مثل وزیرمتن که نسخه‌ی اعداد فارسی دارد. این‌طوری مرتب‌سازی، جستجو و محاسبه همیشه درست کار می‌کند.

در پروژه‌های تبدیل طرح به HTML و قالب وردپرس، نرمال کردن اعداد در همه‌ی فرم‌ها به‌صورت پیش‌فرض انجام می‌شود. برای راست‌چین کردن کامل سایت هم ابزار راست‌چین کردن CSS را ببین.