سبد خرید (0)

تبلیغات

حذف محصول از سبد خرید

جلسه ی هشتم طراحی یک فروشگاه اینترنتی-حذف محصول از سبد خرید

در قسمت اول از این جلسه، به آموزش 'حذف محصول از سبد خرید' خواهیم پرداخت.


آنچه که در قسمت قبل طراحی شد

در قسمت قبل، موارد کلی زیر آموزش داده شدند:

  1. ایجاد قسمت های قیمت کل و ورود به درگاه پرداخت در سبد خرید

مشاهده ی آنچه که در قسمت قبل طراحی شد:

 


آنچه که در قسمت 'حذف محصول از سبد خرید' خواهید آموخت

در قسمت 'حذف محصول از سبد خرید' موارد زیر آموزش داده خواهند شد:

توضیح اجمالی:

  1. نحوه ی حذف محصول از سبد خرید با استفاده از جی کوئری

توضیح تفصیلی:

  1.  انجام کدنویسی جی کوئری برای دکمه ی حذف محصول از سبد خرید.
  2. استفاده از ajax برای حذف محصول.
  3. حذف li مورد نظر از سبد خرید به صورت آنی
  4. تعریف id یا کلاس برای دکمه های ضربدری شکل.

حذف محصول از سبد خرید

 چون که قرار است ما، دستورات جی کوئری و ajax را زمانی اجرا کنیم که کاربر روی این ضربدر های قرمز کلیک می کند، پس بهتر است که به این ضربدرها، یک آی دی و یا کلاس خاص بدهیم، تا بتوانیم در دستورات جی کوئری به سادگی به این علامت های ضربدر دسترسی داشته باشیم:

 یعنی در جایی که در فایل top.php آمدیم و محصولاتمان را از tblsabad دریافت کردیم، و سپس یک li را echo کردیم که در داخل این li علامت ضربدر هم وجود داشت، یک آی دی را تحت عنوان delete مشخص کنیم:

 پس id این ضربدر های قرمز برابر با delete شد. حالا اگر که صفحه را رفرش کنیم، و کلید f12 را فشار دهیم، می بینیم که id این ضربدر ها، delete می باشد. این آی دی باعث می شود که ما کدهای جی کوئری مان را بتوانیم راحت تر بنویسیم.

حالا به سراغ صفحه ی left.php می رویم. درون این قسمت که ما تگ اسکریپت را باز کردیم و دستورات قبلی را نوشتیم، حال می آییم و یک دستور جدید را هم اجرا می کنیم. حال می خواهیم ببینیم که سلکتور ما در اینجا، چه چیزی است. یعنی در چه زمانی می خواهیم عملیات delete برای محصول را انجام بدهیم؟ مشخص است که زمانی می خواهیم این کار را انجام دهیم که کاربر روی دکمه ی delete کلیک می کند. پس در اینجا ما سلکتور خودمان را مشخص می کنیم:

کد

$("#sabad1 li #delete").click

این می شود همان سلکتور ما. زمانی که کاربر بر روی این سلکتور کلیک می کند، یک تابع باید اجرا شود:


دسترسی به موارد آموزشی بالا در بسته ی خریداری شده:

  • شماره جلسه: 8
  • نام فایل ویدئو: 31
  • فرمت فایل: mp4.

نقطه ی شروع بحث بالا (حذف محصول از سبد خرید) در ویدئو: 03:08