طراحی سایت در کرج|شرکت طراحی سایت|سئو در کرج|طراحی اپلیکشن موبایل

برای مشاهده بخش خدمات طراحی سایت به سمت پایین اسکرول کنید

آجاکس فقط یکبار

آجاکس فقط یکبارReviewed by مهدی اخوان on Jul 7Rating:

شاید نوشتن کدهای ajax برای هر پروژه به صورت جداگانه زیاد خوب به نظر نرسد. بیاید یک کد بنویسیم و از آن در تمام پروژه ها استفاده کنیم.

در این مطلب با استفاده از کتابخانه jQuery کدی مینویسیم که فقط با اضافه کردن یک کلاس به تگ form، اطلاعات فرم به صورت ajax ارسال شود، و همچنین پیام مناسب صادر شود.

در ادامه همراه ما باشید…

ابتدا کد زیر را به صفحه اضافه میکنیم.

Source code آجاکس فقط یکبار آجاکس فقط یکبار آجاکس فقط یکبار 
$(document).on("submit", ".ajax-form", function() {
  var form = $(this),
      action = form.attr('action'),
      method = form.attr('method'),
      dataSerialize = form.serialize();
 
  var request = $.ajax({
    type: method,
    url: action,
    data: dataSerialize
  });
 
  request.done(function(data) {
     alert(data);
  });
 
  request.fail(function() {
      alert('fail');
  });
 
  return false;
});

خب. تنها یک قدم دیگر تا اتمام کار کافیست. در مرحله بعد هر فرمی که میخواهید اطلاعات آن به صورت ajax ارسال شود، کافی است کلاس ajax-form را به تگ form اضافه کنید.

نکته ۱: برای بازگشت دادن اطلاعات از سمت سرور، کافیست متنی که میخواهید نمایش دهید را با دستور echo ارسال کنید.

نکته ۲: در تابع خط ۱۳، اطلاعات بازگشتی از سمت سرور، alert میشود، شما میتوانید برای خودتان سفارشی سازی کنید.

نکته ۳: در تابع خط ۱۷، در صورت انجام نشدن عملیات ajax، پیغامی با پیام “fail” به کاربر نمایش داده میشود، شما میتوانید برای خودتان سفارشی سازی کنید.

اگر کد بالا دارای هرگونه اشکال، یا جای کار برای توسعه داشت در نظرات بیان کنید.

مطالب مرتبط

FOLLOW US