ورود

View Full Version : چگونه یک textbox عددی بسازیم که با همه مرورگرها سازگار باشد



mohsen_zelzela00
شنبه 12 دی 1388, 23:18 عصر
با سلام خدمت اساتید محترم

من در سایت خدم احتیاج به یک textbox عددی احتیاج پیدا کردم و کد javascript زیر رو برای این کار نوشتم



<script type="text/javascript">
function numerics() {
if (!((window.event.keyCode >= 45) && (window.event.keyCode <= 57) || (window.event.keyCode == 8))) {
window.event.keyCode = 0;
}
}
</script>


و بعد هر جا می خواستم که textbox من عددی باشد این متد را برای آن صدا میزدم ولی این کد فقط برای IE جواب میداد

اگه دوستان محبت کنند و کمک کنند که من چگونه می تونم این کار رو برای همه مرورگرها انجام بدم ممنون میشم

afshin9032
دوشنبه 14 دی 1388, 14:11 عصر
از regular experssion استفاده كن

onlymaj
دوشنبه 14 دی 1388, 22:23 عصر
سلام
اگه منظورتون اینه میخواید فیلدی داشته باشید که در اون مقادیر عددی وارد کنید بهترین و سریع ترین راه اینه که شما محتوای textbox رو به string و بعد به int تبدیل کنید و با مقدار اولیه چک کنید . اگه برابر بودن که مقادیر وارد شده عدد هستن اما اگه برابر نبودن دیگه عدد نیستن و شما باید پیغام مناسب رو به کاربر بدید

mohsen_zelzela00
سه شنبه 15 دی 1388, 17:26 عصر
سلام
اگه منظورتون اینه میخواید فیلدی داشته باشید که در اون مقادیر عددی وارد کنید بهترین و سریع ترین راه اینه که شما محتوای textbox رو به string و بعد به int تبدیل کنید و با مقدار اولیه چک کنید . اگه برابر بودن که مقادیر وارد شده عدد هستن اما اگه برابر نبودن دیگه عدد نیستن و شما باید پیغام مناسب رو به کاربر بدید

دوست عزیز من یک textbox می خوام که اصلاً کاربر نتونه در اون به غیر از عدد چیزی وارد کنه ممنون میشم اگه کمک کنید

afshin9032
چهارشنبه 16 دی 1388, 01:34 صبح
لينك دانلود ابزار :
http://www.dhtmlgoodies.com/index.html?page=dhtml-suite
لينك demo :
http://www.dhtmlgoodies.com/packages/dhtml-suite-for-applications/demos/demo-form-validator.html

onlymaj
پنج شنبه 17 دی 1388, 00:04 صبح
سلام
دوست عزیز اگه شما می خواید با کدهای آماده کار کنید با استفاده از از framework این کار سختی نیست اما اگه می خواید خودتون کد بزنید می تونید در خاصیت onchange فیلد textbox بیاید به محض ورود کاراکتری توسط کاربر تابعی صدا بزنید که بیاد آخرین کاراکتر وارد شده رو چک کنه که عدد هست یا نه ( با همون روشی که خدمتتون گفتم ) و اگر هم عدد نبود اون کاراکتر رو حذف کنه .

mohsen_zelzela00
پنج شنبه 17 دی 1388, 18:47 عصر
سلام
دوست عزیز اگه شما می خواید با کدهای آماده کار کنید با استفاده از از framework این کار سختی نیست اما اگه می خواید خودتون کد بزنید می تونید در خاصیت onchange فیلد textbox بیاید به محض ورود کاراکتری توسط کاربر تابعی صدا بزنید که بیاد آخرین کاراکتر وارد شده رو چک کنه که عدد هست یا نه ( با همون روشی که خدمتتون گفتم ) و اگر هم عدد نبود اون کاراکتر رو حذف کنه .

دوست عزیز اگه شما به پست 1 نگاه کنید دقیقاً من این کار رو کردم در IE درست کار می کنه ولی در opera عمل نمی کنه

onlymaj
پنج شنبه 17 دی 1388, 22:45 عصر
سلام
دوست من , من به شما یک عذز خواهی بابت گفتن خاصیت onchange بدهکارم.
من خودم تست کرم دیدم این الگوریتم برای خاصیت onchange جواب نمی ده و برای خاصیت onkeyup درست جواب میده . دست به کد شدم و این کد رو نوشتم :

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript">
function maj(fo){
if (fo.value!='')
if (!maj.isnum(fo.value.substr(fo.value.length-1,1)))
fo.value = fo.value.slice(0,fo.value.length-1);
}
maj.isnum = function(num) {
if (parseFloat(num)== num )
return true;
else
return false;
}
</script></head>

<body>
<label for="maj">Text :</label>
<input onkeyup="maj(this)" type="text" name="maj" id="maj" />
</body>
</html>

و روی IE , Firefox , Chrome و safari تست کردم و جواب مثبت گرفتم . opera نبود که تست کنم. خودتون چک بفرمایید که آیا تو opera جواب میده ؟
به گمانم که جواب بده ...

mohsen_zelzela00
جمعه 18 دی 1388, 18:21 عصر
سلام
دوست من , من به شما یک عذز خواهی بابت گفتن خاصیت onchange بدهکارم.
من خودم تست کرم دیدم این الگوریتم برای خاصیت onchange جواب نمی ده و برای خاصیت onkeyup درست جواب میده . دست به کد شدم و این کد رو نوشتم :

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript">
function maj(fo){
if (fo.value!='')
if (!maj.isnum(fo.value.substr(fo.value.length-1,1)))
fo.value = fo.value.slice(0,fo.value.length-1);
}
maj.isnum = function(num) {
if (parseFloat(num)== num )
return true;
else
return false;
}
</script></head>

<body>
<label for="maj">Text :</label>
<input onkeyup="maj(this)" type="text" name="maj" id="maj" />
</body>
</html>

و روی IE , Firefox , Chrome و safari تست کردم و جواب مثبت گرفتم . opera نبود که تست کنم. خودتون چک بفرمایید که آیا تو opera جواب میده ؟
به گمانم که جواب بده ...
دوست عزیز من هنوز تست نکردم ولی میشه در مورد این متدی که نوشتید توضیح بدید که داره دقیقاً چیکار میکنه

با تشکر

onlymaj
جمعه 18 دی 1388, 18:28 عصر
فکر کنم قبلا گفته باشم چی کار کردم ؟

سلام
فیلد textbox بیاید به محض ورود کاراکتری توسط کاربر تابعی صدا بزنید که بیاد آخرین کاراکتر وارد شده رو چک کنه که عدد هست یا نه ( با همون روشی که خدمتتون گفتم ) و اگر هم عدد نبود اون کاراکتر رو حذف کنه .
دقیقا همینه روشش ...
هیچ چیز اضافه ای هم نداره ؟!

eAmin
شنبه 19 دی 1388, 01:55 صبح
کدها آقای جهانی، به این صورت تغییر یافت!:چشمک:

function maj(fo){
fo.value = fo.value.replace(/[a-z]/ig, '');
}

ansar_m
شنبه 19 دی 1388, 14:26 عصر
کدها آقای جهانی، به این صورت تغییر یافت!:چشمک:

function maj(fo){
fo.value = fo.value.replace(/[a-z]/ig, '');
}


ممنون اما این کد حروف فارسی رو فیلتر نمی کنه. من چیزی از جاوااسکریپت بلد نیستم اما این کد رو تست کردم جواب داد:


fo.value = fo.value.replace(/\D/ig, '');

توضیحات: The \D metacharacter is used to find a non-digit character

onlymaj
شنبه 19 دی 1388, 18:09 عصر
ممنونم جناب حیدری ! من با regex زیادکار نکرده بودم .
اما کد دوستمون بهتر جواب داد .

mohsen_zelzela00
چهارشنبه 19 اسفند 1388, 12:53 عصر
دوستان نت هنوز مشکلم حل نشده آخه با این کدها باز هم این اجازه به کاربر داده میشه که کاراکتر غیر عددی هم بگیره.

من در پروژه خودم یک textbox دارم مثلاً اولویت که اصلاً کاربر نباید بتونه حتی یک کاراکتر غیر عددی وارد کنه ممنون میشم اگه کمک کنید

exlord
سه شنبه 25 اسفند 1388, 11:13 صبح
میتونین از ابزار های آمادیی مثل این استفاده کنین...
http://mootools.floor.ch/docs/formcheck/files/formcheck-js.html
و یا اینجوری.........
اینو تو IE و Fire Fox تست کردم........

<input type="text" onkeyup = "keyUP(event.keyCode)" onkeydown = "return isNumeric(event.keyCode);" onpaste = "return false;"/>


function isNumeric(keyCode) {
if (keyCode == 16)
isShift = true;
return ((keyCode >= 48 && keyCode <= 57 || keyCode == 8 ||
(keyCode >= 96 && keyCode <= 105)) && isShift == false);
}

var isShift = false;
function keyUP(keyCode) {
if (keyCode == 16)
isShift = false;
}

nader_30000
چهارشنبه 15 اردیبهشت 1389, 01:09 صبح
بابا این که خیلی ساده هست . بعضی وقتها آدم باید کلک رشتی بزنه

B E H N A M
یک شنبه 21 شهریور 1389, 20:26 عصر
میتونین از ابزار های آمادیی مثل این استفاده کنین...
http://mootools.floor.ch/docs/formcheck/files/formcheck-js.html
و یا اینجوری.........
اینو تو IE و Fire Fox تست کردم........

<input type="text" onkeyup = "keyUP(event.keyCode)" onkeydown = "return isNumeric(event.keyCode);" onpaste = "return false;"/>


function isNumeric(keyCode) {
if (keyCode == 16)
isShift = true;
return ((keyCode >= 48 && keyCode <= 57 || keyCode == 8 ||
(keyCode >= 96 && keyCode <= 105)) && isShift == false);
}

var isShift = false;
function keyUP(keyCode) {
if (keyCode == 16)
isShift = false;
}
فکر کنم آسونترین و سر راست ترین روش همین بود .
ممنون .

mohsen_zelzela00
شنبه 27 شهریور 1389, 09:52 صبح
فکر کنم آسونترین و سر راست ترین روش همین بود .
ممنون .
نه دوست عزیز شما می تونید از کد زیر برای این کار استفاده کنید

<script type="text/javascript">
function isNum(e) {
var keycode;
if (window.event) keycode = window.event.keyCode;
else if (e) keycode = e.which;
if (keycode > 31 && (keycode < 48 || keycode > 57))
return false;
return true;
}





</script>



و روش استفاده از اون به روش زیر است


<asp:TextBox ID="txtItemNo" runat="server" CssClass="txtInfoLeft" onkeypress="return isNum(event);"></asp:TextBox>



البته می تونید این کار رو با jQuery نیز به راحتی انجام بدید

یا علی