چند روزه که بد جوری تو نخ آجاکس جی کوئری هستم چون خیلی توپه شما براحتی و بدون کد نویسی های چند صد خطی می تونید با فراخوانی یک Web Method در سمت سرور توسط تابع $.ajax جی کوئری هر کاری کنید باور کنید برای یه برنامه نویس رویایی تر از این نمی شه . تصمیم گرفتم در یک مثال عملی کمی از شیرینی بچشیم .
ایجاد یک برنامه نمونه برای کار با Ajax در جی کوئری
برای شروع کار باید خاطر نشان کنم ما از Visual Studio 2010 استفاده می کنیم ولی در ورژن های پایین تر هم امکان استفاده فراهم هست . خب بریم سر کارمون یک پروژه وب جدید بسازید :
بعد از زدن دکمه ok و ایجاد پروژه ( توجه کنید پروژه VB باشه نه C#) یک User control جدید در ریشه پروژه ایجاد کنید که اسمش mycontrol.ascx باشه .
خب ما در این User Control قصد خواندن و نمایش اطلاعاتی از دیتابیس رو داریم و چون قصد ورود به موارد دیتابیس را نداریم خیلی ساده یک دیتابیس بسازید و جدولی به نام tbl1 ایجاد کنید با محتویاتی که در عکس زیر می بینید . ( حتما ساختن دیتابیس و ایجاد جدول رو که دیگه می دونید )
خب حالا یک دیتابیس داریم که جدولی به نام tbl1 در آن ساختیم با محتویات بالا . به User Control برگردید و در حالت Design درون آن یک Gridview و یک SqlDataSource قرار دهید . Sqldatasource را طوری تنظیم کنید که محتویات جدول tbl1 رو برگردونه و خاصیت DataSourceID ی Gridview را روی همین SqlDataSource تنظیم کنید . کد شما باید شبیه زیر باشد :
تا اینجای کار کارهای خیلی ساده و ابتدایی انجام دادیم که بارها در پروژه های زیادی انجام دادیم . ما برای شروع کار باید دو فایل جاوا اسکریپت جی کوئری با نام های
jquery-1.4.1.min.js
jquery.blockUI.js
نیاز داریم البته در مورد فایل جی کوئری فکر کنم ورژن های پایین تر هم جواب بده . این فایل ها در پروژه نمونه که آخر مقاله برای دانلود قرار داده ام وجود دارد . حالا به صفحه Default.aspx برگردید و فایل های جاوا را به صفحه اضافه کنید .
علاوه بر اسکریپت های بالا به کد Ajax جی کوئری هم نیاز داریم تا عملیات Load کنترل را انجام بده پس Script زیر را هم به پروژه اضافه کنید :
حالا در حالت Design یک Input(button) به صفحه اضافه کنید و بعد از آن یک Div که User Control را در آن لود می کنیم ایجاد می کنیم توجه کنید ID ای که برای Div در نظر می گیرید حتما همان باشد که در اسکریپت آژاکس نوشته شده در اینجا result می باشد مثل کد زیر :
حالا نوبت اصلی ترین مرحله هست که همون کد نویسی Server Side هست . به قسمت code view صفحه default بروید . دو Name space زیر را وارد کنید :
بعد از وارد کردن این دو Name Space نوبت WebMethod می باشد که تابع load ی که برای User Control نیاز داریم رو فراخوانی می کنه و به شکل زیر می باشد :
و تابع فراخواننده :
خب کار تمامه برنامه را اجرا کنید
بله با زدن دکمه یک پیغام چند لحظه صبر کنید ظاهر می شود و با Render شدن User Control پیغام محو شده و صفحه به شکل بالا User Control مثل شعبده بازی ظاهر می شه . این همون روش خیلی معروف هست که سایت های بزرگ از آن استفاده می کننده حتما دید .
برای دانلود نمونه برنامه اینجا کلیک کنید.
سلام لطفاً کد این مثال برام ایمیل کنید.
فایل مورد نظر در سایت از دسترس خارج شده.
با تشکر
این آدرس دانلود نمونه کد که اشتباه است
خود کد هم که در متن مقاله وجود ندارد
لینک دانلود خراب می باشد. لطفا فایل را مجددا بارگذاری نمایید.
سلام دوست عزیز
می تونید از فرم زیر با نویسنده مطلب که آقا محمد هستن تماس بگیرین .کدها رو احتمالا دارن
http://fotolia.ir/press/author/mohammadmardani
داشتم تو گوگل سرچ می زدم دیدم تو کیورد “آموزش asp.net ” فوتولیا تو صفحه اول قرار داره خوشحال شدم
کسی نیست جواب بده؟!
سلام دوست عزیز
برای دریافت سریعتر جواب تون می تونید با نویسنده مطلب که آقا محمد مردانی هستن ، از طریق پروفایل شون تماس بگیرین ، اگر بتونن در اولین فرصت جواب می دن : http://fotolia.ir/press/author/mohammadmardani
موفقیت
با سلام رضا جان
برای اعمال تغییر در دیتابیس هم باید از json استفاده کنی البته به همراه Linq که از طریق وب سرویس ها باید بهش متصل بشی
مقالات زیادی در این ضمینه موجوده
اگه اطلاعات بیشتری خواستی میل بزن
[email protected]
سلام
اگه بخواهیم از همین user control عملیات Insert, Delete , edite انجام بدیم چکار باید بکنیم ؟ ظاهر این کنترل Visible شده و اگر عملیات فوق رو در گرید بزاریم قابل انتخاب نیستند.
باتشکر
سلام
یک سوال داشتم اگه توی user control از jquery بخوایم استفاده کنیم باید چکار کنیم من انجام دادم اما جواب نداد ممنون میشم اگه راهنمایی کنید.
منظور شما رو نفهمیدم بیشتر توضیح بدید