اعتبار سنجی فرم

[iman64 32]

سلام من یه فرم درست کردم بعد هر فیلدش به صورت انلاین بعد از اینکه از روی فیلد موس رو برداری اعتبار سنجی میکنه یه مشکل کوچیک هم داره اینکه اگه دکمه ثابمیت رو بزنی اگه کاربر چه فرم رو پر کرده باشه یا نکرده باشه فرم ارسال میشه این اعتبار سنجی با کمک ایدی صورت میگره یعنی در یه فایل(file.js) شرط هایی برای ایدی های درون input ها نوشته شده . همونطور که گفتم اعتبار سنجی موقعی که از رو فیلد موس رو برداری انجام میشه اما موقع ارسال , فرم ارسال میشه و اعتبار سنجی ها رو لحاظ نمیکنه . حالا میخوام اگه دکمه ثابمیت زده بشه اون اعتبار سنجی ها لحاظ بشه و فرم رو تا موقعی که درست پر نکرده باشه ارسال نکنه . دقیقا باید چه کار کنم؟

این فایل js

function result(el, msg) {
if(el.attr('switch') == 'show')
{
	 el.parent().parent().next().children('span').html(msg);
	 el.parent().parent().parent().attr('class', 'control-group ' + (msg == "" ? "success" : "error"));
}
else
{
	 el.parent().next().children('span').html(msg);
	 el.parent().parent().attr('class', 'control-group ' + (msg == "" ? "success" : "error"));
}
}
var values= new Array();
$(document).ready(function() {
$('input, select, textarea').blur(function() {
	 var $this = $(this);
	 var value = $this.val();

	 if(values[$(this).attr('id')]==value)
		 return;
	 values[$(this).attr('id')]=value;

	 switch($(this).attr('id')) {
		 case 'txtCardSerial':
			 {
				 if (value.match(/^[0-9]{10}$/)) {
					 result($this, '');
				 } else {
					 result($this, "شماره سریال معتبر نمي باشد.");
				 };
			 };


			 break;
		 case 'txtPostalCode':
			 {
				 if (value.match(/^[0-9]{10}$/)) {
					 result($this, '');
				 } else {
					 result($this, "کد پستي بايد شامل 10 کاراکتر عدد باشد.");
				 };
			 };
			 break;
	 };
});
});

و این هم فرم

<form method="post" id="form1" >
		 <tr class="control-group ">
				 <td style="width:140px;">سریال :</td>
				 <td style="width:330px;">
				 <input name="txtCardSerial" type="text" required="required" id="txtCardSerial" autocomplete="off" value=""
/>
				 </td>

				 <td style="width:140px;">
					 <span class="help-inline" ></span>
				 </td>
			 </tr>

	 <tr class="control-group ">
	 <td>کد پستی:</td>
	 <td>
	 <input autocomplete="off" type="text" maxlength="10" id="txtPostalCode" name="txtPostalCode" value="" >
	 </td>
	 <td><span class="help-inline" ></span></td>
	 </tr>



	 <tr>
	 <td colspan="3" style="text-align: center;padding: 20px;">
	 <button id="submit22" type="submit" name="submit222" class="btn btn-primary formbtn">ثبت</button></td>
	 </tr>

</form>

ویرایش شده مرداد 93 توسط iman64

[Ehsaan 1865]

لطفاً اسپم ندید، کسی بتونه کمکتون میکنه.

اگه میخواید صرفاً از ارسال فرم خالی جلوگیری شه. به ورودی های فرمتون، خاصیت required رو اضافه کنید.

[iman64 32]

منظور فقط جلوگیری نیست . میخوام وقتی دکمه ثابمیت زده میشه رویداد blur اجرا بشه و از ارسال فرم تا موقعی که درست پر نکرده باشد جلوگیری شود

[Parsa 23463]

از رویداد onsubmit استفاده کنید

http://www.w3schools.com/js/js_form_validation.asp

[iman64 32]

درسته اما من ترکیبی از هر دو تا یعنی هم ondubmit و هم blur رو با هم میخوام

ویرایش شده شهریور 93 توسط iman64

[iman64 32]

مشکل که حل نشه مجبوریم بریم سراغ راه های دیگه . البته مشکل حل نشدنی نداریم مشکل خدمونیم که راه حل ها رو نمیدونیم :

خب بریم سراغ اصل مطلب این تابع رو نوشتم و هم روی onsubmit و هم روی onblur ایجادش کردم البته نمیدونم درست بهینه شده یا نه بعد این تابع روی onsubmit به درستی کار میکنه اما روی onblur یه مشکلی داره اینکه وقتی روی فیلدی کلیک کردی و خارج شدی کل خطا های فیلد های دیگر رو نشون بده که نباید اینطور باشه و باید خطای همون فیلد رو نشون بده . یه بررسی کنید دوستان

function validate1() {
errors = ''
errors1 = ''
errors2 = ''
errors3 = ''
errors4 = ''
errors12 = ''
errors13 = ''

if (document.getElementById('form1').number_p.value == "") {
	 errors += '- ' + 'شناسه را وارد کنید' + '\n';
}
else
{
	 var reg = /^[a-z]{1}[a-z0-9_]{3,21}$/;
	 var address = document.getElementById('number_p').value;
	 if (!reg.test(address)) {
		 errors += '- ' + 'شناسه مور قبول  نیست ' + '\n';
	 }

}


if (document.getElementById('form1').name_l.value == "") {
	 errors1 += '- ' + 'نام را وارد کنيد' + '\n';
}

else
{
	 var pattern = /^[ا-ی_]{1,25}$/i;
	 var text = document.getElementById("name_l");
	 if (!pattern.test(text.value)) {
		 errors1 += '- ' + ' نام خود را به صورت فارسی بنویسید ' + '\n';
		 text.focus();
	 }


	 else if
			 (document.getElementById('name_l').value.length < 3) {
		 errors1 += '- ' + ' نام مستعار حداقل باید از سه حرف تشکیل شده باشد' + '\n';
	 }
}

if (document.getElementById('form1').name_s.value == "") {
	 errors2 += '- ' + 'ایمیل را وارد کنید' + '\n';
}
else
{
	 var reg = /^[a-z0-9._-]+@[a-z]+.[a-z.]{6,8}$/i;
	 var address = document.getElementById('name_s').value;
	 if (!reg.test(address)) {
		 errors2 += '- ' + 'ایمیل را به صورت صحیح وارد کنید' + '\n';
	 }
}
if (document.getElementById('form1').id_number.value == "") {
	 errors3 += '- ' + 'شماره شناسنامه را وارد کنيد' + '\n';
}
else
{
	 var num1 = document.getElementById('form1').id_number.value.search("[^0-9]")
	 if ((num1 >= 0) || (document.getElementById('form1').id_number.value.length > 10)) {
		 errors3 += '- ' + 'خطا در اطلاعات ورودي شناسنامه' + '\n';
	 }
}

if (document.getElementById('form1').id_number1.value == "") {
	 errors12 += '- ' + 'شماره موبایل را وارد کنيد' + '\n';
}
else
{
		 var pattern = /^(((\+|00)98)|0)?9[123]\d{8}$/;
var text = document.getElementById("id_number1");
if (!pattern.test(text.value)) {
		 errors12 += '- ' + 'شماره موبایل را به صورت صحیح وارد کنید' + '\n';
	 }
}



if (document.getElementById('form1').id_number2.value == "") {
	 errors13 += '- ' + 'آدرس سایت را وارد کنید' + '\n';
}
else
{
		 var pattern = /^(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?$/;
var text = document.getElementById("id_number2");
if (!pattern.test(text.value)) {
		 errors13 += '- ' + 'آدرس سایت را به صورت صحیح وارد کنید' + '\n';
	 }
}




if (document.getElementById('form1').saltvl.value == "") {
	 errors4 += '- ' + 'سال تولد را وارد کنيد' + '\n';
}
else
{
	 var num1 = document.getElementById('form1').saltvl.value.search("[^0-9]")
	 if ((num1 >= 0) || (document.getElementById('form1').saltvl.value.length < 2) || (document.getElementById('form1').saltvl.value.length > 2)) {
		 errors4 += '- ' + 'سال تولد 2 رقمي مي باشد' + '\n';
	 }
}
if (errors != "") {
	 document.getElementById('family-error').innerHTML = errors;
}

else {
	 document.getElementById('family-error').innerHTML = '';
}
if (errors1 != "") {
	 document.getElementById('family-error1').innerHTML = errors1;
}

else {
	 document.getElementById('family-error1').innerHTML = '';
}

if (errors2 != "") {
	 document.getElementById('family-error2').innerHTML = errors2;
}

else {
	 document.getElementById('family-error2').innerHTML = '';
}

if (errors3 != "") {
	 document.getElementById('family-error3').innerHTML = errors3;
}

else {
	 document.getElementById('family-error3').innerHTML = '';
}
if (errors4 != "") {
	 document.getElementById('family-error4').innerHTML = errors4;
} else {
	 document.getElementById('family-error4').innerHTML = '';
}
if (errors12 != "") {
	 document.getElementById('family-error12').innerHTML = errors12;
} else {
	 document.getElementById('family-error12').innerHTML = '';
}



	 if (errors13 != "") {
	 document.getElementById('family-error13').innerHTML = errors13;
} else {
	 document.getElementById('family-error13').innerHTML = '';
}



if (errors != errors1 != errors2 != errors3 != errors4 != errors12 != errors13 != "") {
	 return false;
}

{
	 return true;
}
}

ویرایش شده شهریور 93 توسط iman64

[iman64 32]

خب مشکل که حل نشد بازم بریم سراغ سوال بعد اگر در فرم ما سه فیلد یکی select و یکی هم فیلد کد امنیتی و اخری هم فیلد سابمیت داشته باشیم و اگر کاربر یکی از گزینه های فیلد select انتخاب کرده باشد منتها اگر فیلد کد امنیتی را اشتباه وارد کرده است و اگر فرم رو ارسال کند و بعد از بارگزاری مجدد صفحه اعتبار سنجی میشود که کد امنیتی اشتباه است حالا فیلد select به حالت قبل بازگشته است باید چیکار کنم که بازم همان گزینه که کاربر انتخاب کرده بود باز هم همون انتخاب شده باشد

ویرایش شده شهریور 93 توسط iman64