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

01:44:00 PM - 1399/08/12

درود و عرض ادب

فرمی دارم که با asp نوشته شده اما فیلدهای داخل آن بصورت سمت کلاینت تعریف شده اند وقتی دکمه ذخیره اطلاعات را می زنم ابتدا فیلدها ارزیابی می شوند و اگر مقدار فیلدی اشتباه باشد و پیامی صادر شده و به صفحه برمی گردد اما صفحه رفرش شده و کلیه فیلدها پاک میشوند قطعاً رفع این قضیه با Ajax امکان پذیر است اما مدلهایی که گرفته و استفاده کرده ام جواب نمی دهد یعنی مقدار فیلدها باز هم پاک میشود

نمونه کد asp

Dim strMelCode As String = Request.Form("HdMeliCode")
        ScriptManager.RegisterStartupScript(Me, Me.GetType, "k", "AjaxRequest('txtMelliCode','txtMelliCode','2')", True)
        If strMelCode.Length < 10 Then           
            Dim str1 As String = "کد ملی بایستی 10 رقمی باشد"
            Call ShowPm(str1)
            Exit Sub
        End If

در کد فوق scriptmanager وظیفه اجرای تابع جاوای AjaxRequest را دارد

این هم تابع AjaxRequest که از سایتی گرفته ام

function AjaxRequest(inputname,divid,inputvalue){
var formvalue = inputname+"="+inputvalue.value;    
var loadingmessage = '<img src="Img/User.png" alt="loading" height="16" width="16" />';    
var xmlhttp;
if (window.XMLHttpRequest){
    // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
    }
    else{
        // code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange=function(){
            if (xmlhttp.readyState<4){
                document.getElementById(divid).innerHTML=loadingmessage;
                }            
                else if (xmlhttp.readyState==4 && xmlhttp.status==200){
                    document.getElementById(divid).innerHTML=xmlhttp.responseText;
                }
        }
        xmlhttp.open("POST","Student_Profile.aspx",true);
        xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
        xmlhttp.send(formvalue);
}
    }

لطفاً در صورتی که مطالب فوق برایتان قابل قبول نیست یا ناقص است ممنون میشوم از اول و شماره و ساده مطالب را برایم بیان فرمایید

با سپاس

ویرایش شده در سه شنبه ۱۱ آذر ۱۳۹۹ ساعت ۱۳:۳۰:۳۸

به این سوال امتیاز بدهید 0 تعداد بازدید این سوال : 4006

پاسخ دهنده : fateme 02:36:00 AM - ۱۳۹۹/۰۸/۱۳

اعتبارسنجی فیلدها توسط جی کوئری

قطعا برای اینکه صفحه شما رفرش نشود باید از اعتبارسنجی های سمت کلاینت استفاده بشه. این اعتبارسنجی توسط جاوا اسکریپت با جی کوئری انجام می شود. شما باید نحوه کار با ایجکس رو یاد بگیرید در مرحله اول. البته انجام این کار خیلی ساده است. براتون یک مثال رو به صورت ساده البته با استفاده از Asp.net Core می نویسم چون با Asp Classic کار نکردم ولی خب تفاوتی هم نمیکنه.

اعتبارسنجی فیلدها با استفاده از Jquery

در ابتدا فرض کنید form زیر را دارید.

<form>
    <input type='text' id='txtname' />
    <input type='text' id='txtfamily' />
    <input type='number' id='txtage' />


   <button type='submit' class='btn'>ثبت اطلاعات</button>
</form>

به صورت خیلی ساده 3 تگ input جهت ورود اطلاعات داریم. حالا شما میتونید با استفاده از دستورات جی کوئری به راحتی این فیلدها رو اعتبارسنجی کنید.

پس کدهای زیر رو به انتهای این form در View اضافه می کنیم.

<script>
   var myname = $("#txtname").val();
   var myfamily = $("#txtfamily").val();
   var myage = $("#txtage").val();

   if (myname == '' || myname == null)
   {
      alert('نام خالی است.');
      return false;
   }
   if (myfamily == '' || myfamly == null)
   {
      alert('نام خانوادگی وارد نشده است');
      return false;
   }
   if (myfamily.length() < 5)
   {
      alert('نام خانوادگی حداقل باید 5 کاراکتر باشد');
      return false;
   }
   if (myage < 10)
   {
      alert('سن نمی تواند کمتر از 10 سال باید');
      return false;
   }

   $.ajax({
     ....
   })
</script>

همونطوری که می بینید به راحتی فیلدها اعتبارسنجی شدن. شما هر اعتبار سنجی دیگه ای که بخواید هم میتونید انجام بدید.

اگر بخواید به صورت حرفه ای تری اعتبارسنجی رو انجام بدید میتونید از پلاگین jquery validation هم استفاده کنید.

Form Validation using Ajax

ویرایش شده در سه شنبه ۱۳ آبان ۱۳۹۹ ساعت ۰۲:۳۷:۱۱