در فرمهای تحت وب، وقتی کاربر عددی مثل 2000000 را در یک فیلد مثل فیلد قیمت وارد میکند، ممکن است گیج شود و نداند دقیقاً چند صفر وارد کرده. اما اگر شما عدد را به صورت 2,000,000 به او نمایش دهید و در حین تایپ، کاماها را خودتان بیافزایید، این مشکل رفع میشود.
برای این کار، یک قطعه کد کامل و عالی برایتان آماده کردهایم.
1- ابتدا فایل زیر را با کلیک راست روی لینک و انتخاب save Target As ذخیره کنید:
http://tutorials.aftab.cc/web/javascript/number_format/NumberFormat.js
2- با قطعه کد زیر، این فایل را به صفحه خود ضمیمه کنید:
<script type="text/javascript" src="js/NumberFormat.js"></script>
(تصور ما این این است که شما این فایل را در پوشه js در کنار فایلی که در حال طراحی هستید، قرار دادهاید)
3- در کنار فیلد مربوط به قیمت، یک input از نوع readonly و یا حتی disabled قرار دهید:
قطعه کد فیلد قیمت و قیلدی که قیمت همراه با کاما را نشان میدهد به صورت زیر است:
<input type="text" name="price" id="price" onkeyup="javascript:FormatNumber('price','price2');" />
<input type="text" id="price2" disabled="disabled" />
به تابع FormatNumber دقت کنید.
این تابع دو ورودی دارد. اولی فیلدی است که عدد را کاربر در آن وارد میکند و دومی فیلدی است که نتیجه عدد همراه با کاما در آن قرار میگیرد.
توجه:
- این تابع اعداد اعشاری را نیز به خوبی تشخیص داده و صحیح و همراه با کاما نمایش میدهد.
- به idها دقت کنید.
موفق باشید؛
حمید رضا نیرومند