آموزش کامل ساخت سیستم نظرسنجی با PHP و AJAX (قسمت دوم)

١۵۵٠١ visibility ٨ mode_comment

دوستان سلام،توی قسمت قبل کارهای لازم برای بانک اطلاعات و همچنی قسمت HTML و CSS انجام دادیم،توی این قسمت کد های JQuery و AJAX لازم رو مینویسیم،ما اینجا از AJAX خود جی کوئری هم استفاده کردیم که کار باهاش راحتتره،توی قسمت نهایی هم کد های سمت سرور رو می نویسیم.پس با ما همراه باشید.

خوب برای شروع تابع ready جی کوئری رو می نویسیم.

بعدشم سه تا متغییر تعریف میکنیم.

خوب حالا این متغییر ها چی هست؟متغییر اول برای ما مقدار گزینه انتخاب شده رو نگهداری میکنه،متغییر دوم برای ما شناسه سوال (یا همون شناسه نظر سنجی) رو نگهداری میکنه و متغییر سوم هم مشخص میکنه که ما برای صفحه PHP که درخواست ای جکس رو پردازش میکنه چه نوع درخواستی رو میفرستیم (منظور درخواست ثبت نظر جدید یا اینکه نمایش نتایج نظر سنجی).

خوب ما با این تیکه کد مشخص میکنیم که هر وقت کاربر روی یکی از گزینه ها (دکمه هایی radio) کلیک کرد مقدارش توی متغییر answer ذخیره بشه.

دکمه ثبت نظر

برای دکمه ثبت نظر ما اول از همه چک میکنیم ببینیم مقدار answer ست شده یا نه اگه ست نشده بود که پیغام نشون میدیم اگه ست شده بود مقدار متغییر action رو برابر vote قرار میدیم و  مقدار input مخفی که توی فرم گذاشته بودیم و حاوی شناسه سوال (شناسه نظر سنجی) بود رو دریافت میکنیم و داخل متغییر question_id قرار میدیم و بعدشم تابع call_ajax رو فراخوانی میکنیم (تایع call_ajax رو خودمون نوشتیم برای جلوگیری تکرار کد ها).

خوب اینم از کد دکمه نمایش نتایج،اولش مقدار action رو برابر result قرار دادیم،بعدشم مقدار question_id رو مثل دکمه قبلی ست کردیم و در نهایت هم تابع call_ajax رو با پاس دادن متغییر های مناسب فراخوانی کردیم.

تابع call_ajax

خوب بچه ها این تابع هم قیافش کمی غلط اندازه و گرنه چیزی نیست،همین که تابع فراخوانی شد اون صفحه سیاه با پیغام لطفا صبر کنید رو نشون میدیم (می تویند از تصاویر loading استفاده کنید) بعدشم در خواست ایجکس رو ست میکنیم،url مقدار آدرس صفحه سمت سرور هست که درخواست مارو پردازش میکنه وبرمیگردنه،قسمت data هم اطلاعاتی رو که میخوایم بفرستیم مشخص میکنیم (ما اینجا همون متغییر های که مقدار دهی کرده بودیم رو این جا می نویسیم)،type هم نوع درخواست رو مشخص میکنه ما اینجا post گذاشتیم،قسمت success هم با یه تابع مشخص میکنه که اگه درخواست موفق بود و اطلاعات برگشت چه کاری انجام بدیم،اون تابع جلوش هم یه پارامتر به نام data میگیره که این data همون اطلاعات برگشتی از صفحه سمت سرور هست،خوب حالا کار اصلی برمیگرده به تابعی که برای success نوشتیم،خوب اول دو تا دکمه مون رو مخفی میکنیم بعدش اون صفحه سیاه صبر کنید رو محو میکنیم و بعد قسمت عنوان سوال نظر سنجی رو با متن نتایج نظر سنجی عوض کردیم،حالا توی فرمی که داشتیم یه تگ div داشتیم با آیدی options که گزینه ها رو توی خودش نگهداری میکرد حالا ما محتویات این قسمت رو با اطلاعات برگشتی از صفحه سمت سرور تعویض میکنیم اونم با کمی افکت،وقتی این افکت تموم بشه ما افکت حرکت گزینه ها رو انجام میدیم،شما الان تیو فرم خودتون گزینه های مثلا s_result یا data-width رو ندارید چون این قسمت ها توی صفحه سمت سرور تولید میشه و به این قسمت برمیگرده (من فقط این توضیح رو بگم که ما اونجا تگهای p ایجاد میکنیم و داخل هر تگ p یه تگ span قرار میدیم که این تگ های span درصد هر گزینه رو توی خودشون نگهداری میکنن،ما اولش توی قسمت استایل خاصیت width این تگ های span رو برابر صف قرار میدیم،برای هر تگ span ما یه خاصیت جدید به اسم data-width تعریف کردیم و مقدار این خاصیت رو با درصد گزینه، مقدار دهی کردیم،حالا وقتی اطلاعات برمیگرده ما مقدرای که توی خاصیت data-width داریم رو به راحتی با جی کوئری دریافت میکنیم و با متد animate جی کوئری نشون میدیم) خوب احتمالا تیو قسمت بعدی خودتون کامل اینو درک میکنید.

کد های کامل قسمت جی کوئری و ای جکس

توی قسمت بعدی کد های سمت سرور پردازش کننده ای جکس رو می نویسیم.

دانلود کد های پروژه - قسمت دوم

comment دیدگاه کاربران
yoosef

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

h1987

سلام من یه سوال داشتم و ببخشین که به این بخش ربطی نداره در هر صورت ممنون میشم حواب بدین.
بنده بعضی وقتا کامپیوترو برا دانلود تا صبح میزارم روشن بمونه و میخواستم ببینم راهی هست که از نظر امنیت خیالمو راحت کنه یه وقت هک نشه چون یه درایوم عکس شخصی هست !ویندوزم 8 هست .میشه با پسورد گذاشتن رو درایو مورد نظر امنیتشو از نظر هک کردن بالا برد؟

سلام زیاد نگران این مسئله نباشید چون برای هکر های کار کشته و حرفه ای اطاعات یه رایانه شخصی زیاد مهم نیست،یه Internet Security خوب مثل Kasper یا Avast یا Smart Security شرکت ESET نصب کنید وخیالتون راحت باشه.پسوورد هم برای سیستمتون بذارید و Sharing های که روی پوشه ها انجام دادید رو غیر فعال کنید.

سهیل

سلام می خواستم بدون چه طوری میشه پرسشنامه روانسنجی ساخت . یعنی فرد بعد پاسخ ، پروفایلش رو ببینه
یه چیزی مثل این پرسشنامه
http://www.ravansanj.ir/mmpi70/Questions/

ممنون میشم توضیح بدید

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

helen

عالی بود آقا
یه دنیا ممنون

mehran

سلام. ببخشید من بخش سوم |آموزش رو نمیتونم پیدا کنم میشه در این مورد بهم کمک کنید؟

نیاز به لاگین

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