آموزش کامل ایجاد سیستم like مطالب با ASP.NET و AJAX

- visibility ٢٩ mode_comment

دوستان سلام، ما توی قسمت های قبلی،سیستم لایک خودمون رو به دلیل اینکه سایت ما بر پایه  آموزش های مبتنی بر PHP کار میکنه و پیش میره برای این پلتفرم نوشتیم ،اما خوب یه عده از کاربران سایت رو دوستان ASP کار ما تشکیل میدن و ما هم به رسم ادب و احترام به این دوستان، تصمیم گرفتیم هم این اسکریپت لایک رو و هم انشاالله اسکریپت های بعدی رو با ASP.NET هم آموزش بدیم،قول این رو به چند نفر از دوستان داده بودیم پس وفای به عهد میکنیم و این کارو انجام میدیم.

کد های HTML,CSS ما همون کد های سیستم PHP هست و فرقی نمیکنه،برای قسمت جاوااسکریپت من تصمیم گرفتم برای سیستم ASP از AJAX Jquery استفاده کنم،فقط خواستم شما با نحوه کارش آشنایی پیدا کنید،انشالله توی سری آموزشی جی کوئری یا سری آموزشی جاوااسکریپت حتما مفصل بهش پرداخته میشه.

توضیحات اصلی

ما این جا یا صفحه های aspx سرو کار داریم،توی این قسمت ما دو تا صفحه در نظر گرفتیم صفحه Default.aspx که کد HTML اصلی رو در بر داره و صفحه ajx.aspx که وظیفه رسیدگی به درخواست های ای جکس مارو،توی PHP ما یه کلاس برای کار با بانک نوشته بودیم این جا هم ما دقیقا یه کلاس برای کار با بانک نوشتیم (شامل اتصال،قطع اتصال و متد های برای اجرای کوئری ها و متد هایی برای دریافت مقادیر از بانک).توی پوشه App_Code یه فایل هست به اسم DAL.cs که همین کلاس بانک مارو در بر داره،اسمش هم برای این DAL گذاشتیم چون توی برنامه نویسی 3 لایه ای (منظورم MVC الان نیست ها!) برای کار با بانک اطلاعات داریم،DAL یعنی Data Access Layer خوب یعنی لایه دسترسی به داده.

برای شروع میریم سراغ قسمت JS.

قسمت showlike

خوب میبینید که همون تابع قبلیه فقط یه تابع جدبد به اسم ajax توش فراخوانی شده،بعدا میرسیم به تعریف تابع ajax فقط خوب ببینید ما به عنوان پارامتر چیا فرستادیم برای همین تابع ajax.

قسمت showdislike

خوب اینم دقیقا مثل همون بالاییه.

قسمت ثبت لایک برای دکمه سبز

این جا همفرقش اینه که  فقط همون تابع ajax رو فراخوانی کردیم.

قسمت ثبت لایک برا دکمه قرمز

اینم توضیح خاصی نداره دیگه.

تابع ajax

رسیدم جاهای خوب داستان،سه تابع پارامتری که گرفتیم اول اسم تابعی که قراره بره توی فایل ajx.aspx برای پردازش،بعدش عنصری که این تابع رو فراخوانی کرده،بعدیش هم ID مطلب مورد نظر،بعدش ما بوسیله jquery درخواست ایجکس خودمون رو پیاده کردیم،با ajax.$ تعریفش میکینم و پرارمتر های لازم رو بهش میدیم،با type متد ارسال داده ها رو مشخص میکنیم (توی فایل ajx.aspx بوسیله کوئری استرینگ مقادیر این نوع ارسال رو دریافت میکنیم)،بعدش url که آردس فایلی که اطلاعات باید برون اونجا رو مشخص میکنه،بعدش data که اطلاعاتی رو که باید بره مشخص میکنه (اگه توجه کنید مقدار جلوی data رو به صورت کوئری استرینگ نوشتیم)،مقدار success با تابع جلوش مشخص میکنه اگه اطلاعات با موفقیت رفت و برگشت چیکار بکنیم (می تونیم error رو هم تعریف کنیم که من تعریف نکردم)،توی تابع جلوی success نوشتیم اگه مقدار func که تابع ajax دریافت کرده بود showlike یا showdislike بود،اطلاعات برگشتی رو بذار توی همون تگ span (برای همین بود که ما اون عنصری که تابع رو فراخوانی کردهبود بهش پاس دادیم)،اگر هم مقدار func ما updatelike یا updatedislike بود فقط اونو به صورت پیغام نشون بده.

comment دیدگاه کاربران
mohamadi.manijeh

جناب مهندس من کدها را دستکاری نکردم دیتابیسم هم اسکیوال کردم ولی باز این مشکل را داشت وقتی رفتم توی دیتابیس یک مقداری را دستی وارد کردم تونستم خروجی را ببینم یعنی این با مقدار اولیه مشکل داره … بع د هم که مقدار اولیه بهش دادم وقتی روی + – کلیک میکنم پیغام ثبت شد را میدهد ولی این علامت لودینگ همچنان میچرخد تا اینکه یک بار صفحه را رفرش کنم تا از این حالت خارج شود .. یک مورد دیگه هم اینه که اصلا چک نمیکنه من قبلا رای دادم و اجازه میدهد من هر تعداد که میخواهم لایک کنم .. این حالت ویرایش شده فایل هست که من تست میکنم

کیوان علی محمدی

شما کدی رو که دارین برای من قرار بدین تا من بررسی کنم.

mohamadi.manijeh

همان که شما چندیدن تایپک بالاتر گداشتین
(۱۵ مرداد ۱۳۹۲ ساعت ۱:۳۳ ب.ظ )
که البته دستکاری در کد hover بود ..فرق انچنانی با کد اصلی نداست….

mohamadi.manijeh

کد جاوااسکریپت این بوده

کیوان علی محمدی

خوب این کد دقیقا همون کدی هست که تست شده و جواب داده،قبلا یکی از کاربران از ما خواسته بودن کد رو کمی بهینه کنیم و به همین خاطر ما هم این کارو انجام دادیم.من این کد های بهینه تر رو برای شما هم قرار میدیم امیدوارم استفاده کنید.خواهشا برای قرار دادن کد ها حتما توی یه فایل بذارید و اپ کنید،اینجوری کلی فضای نظرات به هم میریزه.ممنون
http://up.persianscript.ir/uploads/137804493289211.zip

کریمی

اگر حس روئیدن در تو باشد، حتی در کویر هم رشد خواهی کرد…
(دکتر شریعتی)
ممنون از انتشار اطلاعات مفیدتون. موفق باشید و سلامت.

برای من هیچ اروری نمیده ولی اصلا هیچ کاری هم نمیکنه

عمل نمیکنه

درست شد 🙂

ممنون

raminn

با تشکر از مطلب خوبتون ..فقط یه سوال من میخاوم نمایش تعداد لایک ها و دیس لایک ها کنار دکمه هاباشه و تو hover نباشه ! … ممنون میشم دقیقا بگید کدوم قسمت رو تغییر بدم ! ..مرسی

کیوان علی محمدی

سلام کمی باید کدها رو دستکاری کرد،من برای نشون دادن لایک های اینو مینویسیم خودتون دیگه از این الگو بگیرید.

$('.like').each(function() {
var el=$(this);
var id = el.data("id");
showlike(el,id);
});

نیاز به لاگین

برای ارسال دیدگاه و یا پرسیدن سوال خود در این قسمت، باید در سایت لاگین شوید.
1 2