مقدمه :
در آخرين مقاله ام، در مورد استفاده XMLHttpRequest براي ساخت، ارسال و پردازش درخواستهاي XML همزمان با برنامه هاي کاربردي A.net توضيح دادم. ولي حالا که توانستم به علم پنهاني که در JavaScrip بود پي ببرم، مي خواهم مورد ساده اي را که باور دارم يکي از بهترين و ساده ترين Toolkit هاي Ajax براي VisualStudio است را معرفي کنم.
و راه ساده ي را به شما نشان خوام داد تا شما بتوانيد يک انتخابگر رنگ با استفاده از قالبليتهاي Ajax براي برنامه کاربردي Asp.net بسازيد.
Background:
در اين مثال از Ajax-toolkit که به عنوان Anthem شناخته شده استفاده مي شود. شما ممکن است اين اسم را بارها اين طرف و آن طرف شنيده باشيد خصوصاً در مقالات سايت CodeProject.
Anthem يک سري ابزار براي VisualStudio است که به سادگي تحولات زيادي به برنامه Asp.net شما در دنياي Ajax مي بخشد. با کمي اطلاعات در مورد VisualStudio و تقريباً هيچ دانشي از JavaScript، شما مي توانيد توابع کنترلي Ajax را تنها با عمل Dragg کردن کنترلِ مورد نظر در صفحه وبتان و دستکاري کدها، پياده سازي کنيد.
ما مي خواهم جزئيات بکار بردن Anthem را در ادامه براي شما توضيح دهيم، ولي قبل از آن شما بايد مطمئن شويد که آخرين نسخه Anthem را در محيط Visual Studio خودتان داريد. شما مي توانيد، بسته ي Control يا control packageرا به صورت رايگان در آدرس SourceForge دانلود کرده .Anthem بوسيله Jason Diamond ساخته و در حال حاضر يک پروژه فعال در sourceForge است. اين برنامه در سادگي بي نظير است.
شروع :
از اينجا با در نظر گرفتن موارد زير شروع کنيد:
- شما Anthem را دانلود کرده ايد.
- شما براي نسخه VS.NET خودتان پروژه ساخته ايد.
- و در نهايت شما کنترلها را به VS.NET toolkit اضافه کرده ايد.
بعد از اينکه شما کنترلها را به ابزار VS.NET اضافه کرديد، بايد چيزي شبيه به اين داشته باشيد :
در مقالات آينده، در رابطه با استفاده بعضي از کنترلهاي فراهم آمده، صحبت خواهيم کرد، ولي براي الان فقط مي خواهيم به کنترلهاي Lable و Buttonبپردازيم.
دورنگاه:
ابزارهاي Anthem مي توانند تمام JavaScript ها و XMLHttpRequestها را براي شما اداره کنند. شما يک کنترل را همانند کنترهاي Asp.net به صفحه وب مورد نظر Dragg مي کنيد. تنها تفاوت اصلي اين است که شما زماني که روي کنترل جهت اضافه کردن handler رويداد کليک مي کنيد، کنترل Anthem يک تابع callback بجاي تابع Postback مي سازد.
اين از اسرار Ajax است، و زيبايي کنترهاي آن در اين است که event handler در نگاه هيچ تفاوتي با توابع C# استاندارد ندارد.
در مثال ارائه شده، ما يک جدول HTML ساده که حاوي 48 خانه (6*8) است ساخته ايم.
که در هر خانه يک دکمه anthem است که هر کدام هم يک رنگ پس زمينه خاص دارند. تمام اين دکمه ها توابع callback شبيه بهم دارند :
در قسمت اول کدها، شيء Sender پاس داده مي شود به نوع Button، به اين دليل که ما مي دانيم که sender به هر حال يک Button است. حالا که ما يک شيء Button داريم (btn)، ما مي خواهيم رنگ آن را بوسيله btncolor تنظيم کنيم ( اين يک دکمه ديگر است که بالاي lable آمده ). حال شما با يک مورد مهم روبرو مي شويد که مخصوص Anthem است:
;this.btnColor.UpdateAfterCallBack=true
کاري که مي کنيم اين است که ما به تابع اجازه مي دهيم که بداند چيزي در ارتباط با btncolor تغيير داده ايم، و بعد از اينکه callback به اتمام رسيد، آن احتياج به Update دارد. اين قسمتي از کدي است که نشان مي دهد که رنگ پس زمينه جديد از btncolor از نگاه کاربر تغيير مي کند.
گام بعدي Update کردن lblcolor (lable) با مقادير هگزا دسيمال است. شما ملاحظه مي فرمائيد که متد ColorToHex(System.Color) صدا زده شده. اين تابع و توابع مربوطه بوسيله Sandro Todesco فراهم آمده اند. با توجه به اطلاعات من، هيچ متد تکي در .net وجود ندارد که System.Color را به مقادير هگزادسيمال تبديل کند. و آن اين کارِ سخت را با استفاده از system.color و برگرداندن مقدار هگزادسيمال براي ما انجام ميدهد. در متد palette_click() ملاحظه مي فرمائيد که :
;this.lblColor.UpdateAfterCallBack=true
استفاده از کدها :
من توابع Anthem را به چند دليل مورد آزمايش و نمايش قرار داده ام؛ اول، اينکه ممکن است شما فقط يک انتخابگر رنگ، براي برنامه خودتان مي خواهيد. وقتي شما اين مثال را اجرا کنيد ممکن است براي شما ديدن کدهاي html آن هم جذاب باشد. شما تمام توابع JavaScript ي که به صورت اتوماتيک در زمان اجرا بوسيله کنترل هاي Anthem ساخته شده اند را مي بينيد.
استفاده از Ajax در اين روش به ما اين اجازه را مي دهد که، حتي اگر به JavaScript هم تسلط کافي نداشته باشند، بتوانيد وب سايتهاي پيچيده اي با استفاده از زبان .net بسازند.
معرفي سايت مرتبط با اين مقاله