# مباحث مرتبط با توسعه وب > توسعه وب (Web Development) >  تکنولوژی جدید AJAX

## shahramasp

Ajax چیست؟ 


امروزه، معمولا وقتی صحبت از طراحی برنامه های تعاملی(interaction design ) می شود،بیشتر توجه ها معطوف به وب است. برنامه های کاربردی تحت وب به سرعت در حال رشد و توسعه هستند و کاربران دوست دارند که با همان راحتی و سرعتی که با Desktop application ها کار می کنند با Web application ها هم کار کنند. طراحان برنامه های کاربردی وب هم برای از بین بردن این شکاف ، روش های طراحی گوناگونی را پیشنهاد کرده اند.یکی از این روش ها روش Ajax است. Ajax مخفف Asynchronous JavaScript + XML می باشد.
نگاهی به Suggest Google و Google Maps بیندازید . در Google Maps وقتی روی قسمتی از نقشه zoom می کنید و یا بالا و پایین می روید همه چیز تقریبا به طور همزمان و بدون Load شدن مجدد صفحات انجام می شود. در Suggest Google نیز وقتی مشغول تایپ کلمه مورد نظر خود هستید، به طور همزمان کلمات مرتبط با آن و نیز نتایج حاصل از جستجوی آنها نمایش داده می شود. این برنامه ها چگونه کار می کنند؟
مدل کلاسیک برنامه های کاربردی وب به این صورت است که: کاربران توسط یک واسط، درخواست خود را به وب سرور ارسال می کنند. سرور پردازشی خاص برای درخواست مورد نظر کاربر انجام می دهد و سپس نتیجه را به صورت HTML به کاربر برمی گرداند. این مدل با کاربرد اولیه وب به عنوان واسط انتقال hypertext سازگار است اما تجربیات نشان می دهد که در طراحی برنامه های کاربردی لزوما استفاده از این مدل نتیجه مطلوب کاربران را نمی دهد!
وقتی که سرور مشغول پردازش درخواست ها است، کاربر چه می کند؟ مسلم است که انتظار می کشد! و این انتظار در هر مرحله از انجام کار بیشتر و بیشتر می شود! زمانی که یک فرم وب را در برنام کاربردی خود قرار می دهید کاربر باید تا زمان دریافت نتایج صبر کند.اصلا چه لزومی دارد که کاربر ببیند برنامه او به سمت سرور می رود؟! Ajax به این پرسش ها پاسخ می دهد

----------


## shahramasp

رفقا من این مبحث رو راه انداختم تا باهم تبادل نظر کنیم لطفا اگه شما هم اطلاعاتی در مورد این تکنولوژی جدید دارد بگید منتظرم

----------


## keramatiabi

http://groups.google.de/group/ajaxpro

----------


## shahramasp

در طول این قسمت پس از مروری کوتاه بر اصول و زیر ساخت های AJAX به آموزش استفاده عملی از AJAX در ASP.NET به ذکر یک مثال ساده میپردازیم .تکنیک های پیشرفته استفاده از AJAX را به قسمت سوم موکول می کنیم.

همانطور که در قسمت اول خواندیم ،دیدیم AJAX ترکیبی از چند تکنولوژی موجود می باشد که هدف آن بهینه سازی تبادل داده ها بین سرورو کاربرهم در جهت کاهش حجم داده وهم نحوه نمایش مطلوب آن ها می باشد.اگر دوباره به نمودار قسمت اول دقت کنید خواهید دید که با آمدن مدل AJAX تبادل داده بین سرور و کلاینت تفاوت های اساسی کرده:صفحه قابل مشاهده کاربر برای گرفتن اطلاعات جدید در خواست خود را مستقیم به سرور نمیدهد بلکه به ماجولی در سیستم خودش به نام AJAX Engine میدهد.AJAX Engine وظیفه دارد در خواست ها را به سرور بفرستد و هنگام در یافت پاسخ ،آنهارا به صفحه در خواست کننده اعلام کند.حال وقتی صفحه پاسخ خود را دریافت کرد با کد javascript میتوان اطلاعات جدید را در قسمتی از صفحه ی خود تزریق کند.

تئوری محض کافیه...با جند مثال مطلب خیلی بهتر بیان میشه.

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

خوب برای حل این مثال بدون استفاده از AJAX مجبوریم یک deropdownlist که runat=server است بگذاریم و در رخداد OnSelectedIndexChanged آن- در سمت سرور- به دنبال دمای شهر انتخاب شده بگردیم سپس دما را در یک label نمایش دهیم.این روش باعث postback شدن کل صفحه ما فقط برای نمایش یک عدد دمای شهر میشود.برای جلوگیری از این اتلاف وقت و هزینه (به خاطر postback شدن کل صفحه) از ajax استفاده میکنیم.

برای استفاده از AJAX ابتدا کتابخانه رایگان آن را از اینجا دانلود کنید.پس از گرفتن ajax.dll آن را در قسمت solution explorer-refrences با کلیک راست کردن بر روی refrences و انتخاب add refrence... وپیدا کردن فایل ajax.dll اضافه کنید.

قبل از هر کاری در فایل web.config بخش زیر را اضافه کنید:




<configuration>

<system.web>

<httpHandlers>

<add verb="POST,GET" path="ajax/*.ashx"
type="Ajax.PageHandlerFactory, Ajax" />

</httpHandlers>

...

<system.web>

</configuration>


فرض کنید مثال ما در صفحه ی index رخ میدهد .ابتدا باید دررخداد Page_Load صفحه را به عنوان استفده کننده ajax معرفی کنید.که به شکل زیر این کار را میکنیم.دقت کنید که این خط برای هر صفحه aspx که میخواهد از ajax استفاده کند باید در page_load اش نوشته شود:

Ajax.Utility.RegisterTypeForAjax(typeof(yourpagecl  ass));

در مثال ما کدی به شکل زیر خواهد شد:


namespace AjaxTest
{

....

public class Index : System.Web.UI.Page
{
....

private void Page_Load(object sender, System.EventArgs e)
{
Ajax.Utility.RegisterTypeForAjax(typeof(Index));
.....

}

...


حالا یک متد در سمت سرور مینویسیم تا با گرفتن نام شهر دمای آن را برگرداند.(نحوه ی پیداکردن دما برای ما اصلا اهمیت ندارد، فرض کنید این دما را از یک وب سرویس میگیرد و یا از پایگاه خود پیدا میکند در هر صورت برای ما تبادل اطلاعات بین سرور و کاربر مهم است نه نحوه یافتن آن ها،لذا در مثال ها فقط نحوه استفاده از ajax برای تبادل در خواست و نتایج بین سرور و کاربر بررسی میشود)



public int FindCityTemperature (string pCity)

{

int result=0;

...//find result

return result;

}



خوب یک متد سمت سرور نوشتیم،حالا تصمیم داریم این متد را به عنوان متدی که ajax بتواند سرویس دهد مشخص کنیم.برای مشخص کردن متد های سمت سرور به عنوان متد استفاده کننده از ajax عبارت زیر را قبل از آن متد قرار میدهیم:


[Ajax.AjaxMethod()]

پس متد FindCityTemperature ما میشود:

[Ajax.AjaxMethod()]

public int FindCityTemperature (string pCity)

{

int result=0;

...//find result

return result;

}



خسته نباشید.کد نویسی سمت سرور تمام شد.حالا باید script نویسی سمت کاربر روشروع کنیم و طبیعتا javascript رو انتخاب میکنیم(البته هیج فرقی نمیکنه چه زبانی رو انتخاب کنید، به هر حال من که حسابی از script نویسی سمت کاربر بدم میاد).دقت کنید تمام کد هایی که تا کنون نوشتیم در فایل cs مثلا index.aspx.cs بود.حالا صفحه aspx را باز کنید تا کد های سمت کلاینت رو بنویسیم.کد زیریک dropdownlist ویک div برای نمایش نتایج است .در قسمتی از body صفحه html خود قرارش دهید.دقت کنید id داده شده به select و div برای پیدا کردن آن در کد ها استفاده میشود:


 <select id="MyDDL" onchange ="GetAndDispayTemp()" size="1" >
<option>تهران</option>
<option>مشهد</option>
<option>اصفهان</option>
<option>تبریز</option>
<option>شیراز</option>
</select>
<div id="TempRes"></div>
د ر قسمت meta صفحه دو خط زیر را اضافه کنید:

<script language="javascript" src="ajax/common.ashx"></script>

<script language="javascript"
src="ajax/NAMESPACE.PAGECLASS,ASSEMBLYNAME.ashx"></script>

به جای NameSpace و AssemblyName فضای نام پروژه خودتان و به جای pageclass نام کلاس صفحه را جایگزین کنید که در مثال ما میشود :


<script language="javascript" src="ajax/common.ashx"></script>

<script language="javascript"
src="ajax/AjaxTest.Index,AjaxTest.ashx"></script>




حالا وقت نوشتن کد جاوا اسکریپت رسیده:


<script>
function GetAndDispayTemp()
{
var city=document.getElementById("MyDDL").item(MyDDL.s  electedIndex).text;
var citytemp=Index.FindCityTemperature(city);
document.getElementById("TempRes").innerText=cityt  emp+"&#176;C";
}
</script>

این اسکریپت رو میون تگ ها html صفحه بنویسید...حالا فکر میکنم بیموقع نباشه بهتون بگم تبریک شما اولین صفحه AJAX خود را ساختید

----------


## mahmoodvb

همه چیز در مورد انقلاب Ajax
* Ajax:روشی نوین در طراحی برنامه های کاربردی تحت وب* 

http://www.developercenter.ir/Forum/...highlight=ajax


* پدیده‌ انقلابی Aja*
http://www.developercenter.ir/Forum/...highlight=ajax

* تکنولوژی Ajax با نام Atlas وارد ASP.NET 2.0 شد* 
http://www.developercenter.ir/Forum/...highlight=ajax

*MagicAjax.NET Examples for ASP.NET 2.0* 
http://www.developercenter.ir/Forum/...ead.php?t=1377

----------


## shahramasp

اشاره : 
اگر برنامه نویس وب هستید، لابد خبر دارید که این روزها همه درباره Ajax صحبت می‌کنند. بعضی معتقدند ‌Ajax یکی از ارکان فنی موج جدیدی است که به Web 2.0 معروف شده است و انجمن‌ها و تریبون‌های آنلاین مملو از مقالات و اظهارنظرهای مربوط بهAjax است 



اگر برنامه نویس وب هستید، لابد خبر دارید که این روزها همه درباره Ajax&#160;صحبت می‌کنند. بعضی معتقدند ‌Ajax&#160; یکی از ارکان فنی موج جدیدی است که به Web 2.0&#160;معروف شده است. بعضی از سایت‌های بزرگ مانند یاهو و گوگل هم‌اکنون ‌Ajax&#160;را به خدمت گرفته‌اند، انجمن‌ها و تریبون‌های آنلاین مملو از مقالات و اظهارنظرهای مربوط بهAjax&#160;است و همزمان تلاش‌های وسیعی در جریان است تا این فناوری جدید همچنان به صورت اپن سورس باقی بماند و انحصاری نشود. 
Ajax&#160; چیست؟
واژه Ajax&#160;با تلفظ <ای‌جکس> یا <ای‌ژاکس> سرنام عبارت Asynchronous JavaScript and XML&#160;و به معنی <ترکیب نامتقارن جاوا اسکریپت و>XML&#160; است. ماهیت صفحات وب و پروتکل HTTP به گونه‌ای است که به طور معمول وقتی درحال وب‌گردی هستیم، به ازای هر کنش و واکنش میان ما و سایتی که در حال کار با آن هستیم، کل یک صفحه وب از نو بارگذاری و تازه‌سازی (refresh)&#160;می‌شود. 

ای‌جکس فناوری جدیدی است که تغییر محسوسی را در این سناریو به وجود می‌آورد؛ به این ترتیب که به جای بارگذاری مجدد کل صفحه، فقط قسمتی تغییر می‌کند که قرار است اطلاعات جدید را به نمایش درآورد و کلیه عملیات ارسال اطلاعات و دریافت نتایج در پشت صحنه انجام می‌شود. در نتیجه هیچ‌گاه صفحه سفید و خالی وب در فواصل کنش و واکنش‌های هنگام کار با مرورگر دیده نمی‌شود و احساسی مشابه تجربه کار با یک نرم‌افزار دسکتاپ به کاربر دست می‌دهد.

جادوی ای‌جاکس چیزی نیست جز یک فکر بکر و آن هم ترکیب کردن جاوا اسکریپت و XML&#160;در قالب یک موجود ‌نرم‌افزاری جدید. 

اصطلاح ‌Ajax&#160;را اولین بار کارشناسی از شرکت Adaptive Path&#160;به نام جسی جیمزگرت در مقاله‌ای با عنوان <ای‌جکس؛ رهیافت جدیدی در برنامه‌های تحت وب> مطرح کرد و خیلی سریع مورد استقبال گسترده برنامه نویسان وب در سراسر جهان قرارگرفت. اعتقاد عمومی این است که تاریخچه به‌کارگیری تکنیک مذکور به پیدایش نرم‌افزار Outlook WebAccess&#160;و استفاده از فرمان XMLHttpRequest&#160;که مایکروسافت ابداع کرده و در نرم‌افزار اینترنت اکسپلور به‌کار رفته است، برمی‌گردد. اما امروزه اغلب مرورگرهای مهم و شناخته‌شده (از جمله فایرفاکس) از آن پشتیبانی می‌کنند و دیگر یک فناوری محدود به اینترنت اکسپلورر نیست.
چرا Ajax&#160;این قدر اهمیت‌دارد؟

منابع اطلاعاتی سودمند درباره Ajax
- راهنمای Ajax برای مبتدیان
- چرا اکنون Ajax مهم است؟
- Ajax‌ به نرم‌افزار‌های تحت وب حال و هوای تازه‌ای می‌دهد
- راهنمای موزیلا برای شروع کار با Ajax
- چگونه یک Ajax در ASP.NET بسازیم؟
- روش استفاده از Ajax
- پورتال ای‌جکس کاران
- معرفی انواع نرم‌افزارها و پیاده‌سازی‌های Ajax
- تشکل آنلاین ای‌جکسی‌ها
- اصول و قواعد طراحی با&#160;Ajax
- پادکست یکی از علاقه‌مندان Ajax
- مجله Ajax
فناوری ای‌جکس جدید است و شگفت‌انگیز به‌نظر می‌رسد. ولی در حقیقت کل این شعبده بر اساس فناوری‌هایی بنا شده است که هم‌اکنون موجودند: جاوا اسکریپت و XML. هر دوی این فناوری‌ها تا حد زیادی باز هستند و منحصر به شرکت خاصی نیستند. به همین دلیل این روزها تمام محافل دنیای برنامه نویسی مملو از مقالات و تحلیل‌هایی درباره Ajax است. به عنوان نمونه می‌توانید صفحه نخست سایت موسوم به <کانال شبکه برنامه نویسان سان> را بازکنید.
&#160;
بیشتر این صفحه (در زمان نگارش این یادداشت) به مقالات و مطالب متنوعی درباره Ajax اختصاص یافته است. مجلات برنامه‌نویسی نیز مقالات متعددی در این زمینه منتشر کرده‌اند و سایت‌های معروفی مانند 
O' Reilly و xml.com&#160;نیز در این باره مطلب دارند. 

بنابراین ظرفیت بالایی برای تبدیل ای‌جکس به یک استاندارد جهانی وجود دارد. از این رو قرار است در تاریخ سیزدهم مارس سمینار مهمی در زمینه Ajax&#160;برگزار شود. اگر همین الان به سایت ajaxseminar.com&#160;مراجعه کنید، متوجه می‌شوید که علاوه بر طراح این تکنیک، چندین برنامه‌نویس شاخص از شرکت‌های بزرگی همچون یاهو در آن شرکت خواهند داشت. 

این فناوری از یک جنبه دیگر نیز اهمیت دارد. به‌دلیل عدم نیاز به بارگذاری مجدد کل یک صفحه وب، مقدار داده‌هایی که لازم است برای تکمیل یک Interaction&#160;&#160;میان کاربر و سایت مبادله شود، به شدت کاهش می‌یابد و این به معنی افزایش محسوس سرعت نرم‌افزارهای تحت وب، سهولت به‌کارگیری اینترفیس‌های مبتنی بر&#160; ای‌جکس و کاربرپسندترشدن آن‌ها می‌شود. به همین دلیل&#160; این روزها اکثر پورتال‌های بزرگ (مانند یاهو) مشغول طراحی اینترفیس‌های مبتنی بر Ajax&#160;هستند. 

با این همه مزایای ای‌جکس‌ به همین‌ موارد ختم نمی‌شود. تصور کنید وقتی در طول شبانه روز میلیاردها بار فرآیند بارگذاری مجدد صفحات وب تعاملی در شبکه اینترنت تکرار می‌شود، استفاده از ای‌جکس چگونه موجب آزاد شدن پهنای‌باند اینترنت و در نتیجه میلیاردها دلار صرفه‌جویی اقتصادی در این زمینه می‌شود و این به نوبه خود انقلابی در عرصه وب و فضای سایبر به شمار می‌رود. این تحول در شرایطی اتفاق می‌افتد که همزمان فناوری‌های اینترنت پرسرعت همچون ADSL&#160;به شدت در حال رشد هستند. 

حال تصور کنید اگر فناوری&#160; ای‌جکس در مقیاس گسترده‌ای مورد استفاده نرم‌افزارهای تحت وب قرارگیرد. آنگاه افزایش سرعت کار با اینترنت چند برابر خواهد شد. چنین تحولی می‌تواند اینترنت را به کامپیوتر دوم کاربران تبدیل کند. به گونه‌ای که برای آن‌ها اجرای یک نرم‌افزار از روی وب تفاوت محسوسی با اجرای آن از روی کامپیوتر دسکتاپ نداشته باشد. در این صورت ممکن است واقعا بخش مهمی از توان پردازشی نرم‌افزارها، چه از نوع دسکتاپ و چه از نوع تحت وب به سیستم‌های موسوم به Web Service واگذار شود. از این رو کسانی که مبتکر و مشوق ایده وب سرویس بوده‌اند، این روزها انگیزه تازه‌ای برای سرعت بخشیدن به این فناوری پیدا کرده‌اند و تلاش می‌کنند دو فناوری&#160; ای‌جکس و وب سرویس‌ را به‌یکدیگر پیوند دهند و راهکارهای تازه‌ای بیافرینند.

&#160;کدام سایت‌ها از ای‌جکس استفاده کرده‌اند؟
دنیای برنامه‌نویسی وب هنوز درگیر هیجانات مربوط به آشنایی با این پدیده است و در حال بررسی مشکلات تکنیکی و هضم و جذب آن در بافت برنامه‌های تحت وب می‌باشد. به همین دلیل میزان استفاده عملی از آن چندان گسترده نیست. اما چون کارایی ای‌جکس دیگر برای همه ثابت شده است، حرکت‌های بزرگی در سراسر اینترنت به سمت استفاده از این فناوری در جریان است. از جمله اینترفیس نسخه دوم Yahoo Mail که به نسخه بتا معروف است و فعلا در دسترس کاربران سرویس غیر رایگان یاهو قراردارد، از همین فناوری استفاده می‌کند که به زودی اینترفیس جدید در دسترس عموم قرار می‌گیرد. سرویس Gmail و Google Map&#160;نیز از این فناوری استفاده می‌کنند.

----------


## shahramasp

http://www.mousewhisperer.co.uk/ajax_page.html
						راهنمای Ajax برای مبتدیان
						-
http://www.ok-cancel.com/archives/ar...tters-now.html
						چرا اکنون Ajax مهم است؟
						-
http://beta.news.com.com/Ajax+gives+...3-5886709.html
						Ajax‌ به نرم‌افزار‌های تحت وب حال و هوای تازه‌ای می‌دهد
						-
http://developer.mozilla.org/en/docs...etting_Started
						راهنمای موزیلا برای شروع کار با Ajax
						-
http://www.developerfusion.co.uk/show/4704
						چگونه یک Ajax در ASP.NET بسازیم؟
						-
http://www.sitepoint.com/article/remote-scripting-ajax
						روش استفاده از Ajax
						-
http://www.ajaxmatters.com
						پورتال ای‌جکس کاران
						-
http://www.ajaxreview.com
						معرفی انواع نرم‌افزارها و پیاده‌سازی‌های Ajax
						-
http://www.ajaxian.com
						تشکل آنلاین ای‌جکسی‌ه
						-
http://www.ajaxpatterns.org
						اصول و قواعد طراحی با&nbsp;Ajax
						-
http://www.ajaxian.com/archives/podcast/index.html
						پادکست یکی از علاقه‌مندان Ajax
						-
http://ajax.sys-con.com
						مجله Ajax

----------


## shahramasp

نمای Ajax


خالق Ajax

----------


## nazaninam

شهرام جان اگه میشه لینک دریافت این کتابخانه رو دوباره برامون بگذارید چون پیداش نکردم
نمیدونم دوستان ورژن جدید کنترل پنل Plesk  رو دیدن یا نه می خوام بدونم اگه ندیدید حتما یک نگاهی بهش بندازد فوق العادست... سیستم جالبی فکرم نمیکنم ای جکس باشه...

----------


## shahramasp

مایکروسافت هم برای استفاده از Ajax در حال کار بر روی پروژه ای به نام Atlas  است که فکر کنم به زودی آماده پیش نمایش شود. خالاصه اینکه تصور من این است Ajax به تدریج فراگیر تر بشه و سهم بیشتری از وب رو در اختیار بگیره. 

راستی ئر مورد معایب Ajax هم اگه کسی چیزی میدونه بگه من هم یه چیزایی میدونم مثل اینکه با Back And Forward مشکل داره و در حقیقت اونا را از بین میبره و اینکه به XmlHttpRequest به شدت نیازمنده در صورتی که از نظر امنیتی بسیار ضعیف است ....
رفقا شما هم یه چیزی بگید

----------


## shahramasp

این آدرس یه سایت خفن Ajax برید ببینید می فهمید 
http://protopage.com/v2
اینم لینک پروژه Atlas
http://weblogs.asp.net/scottgu/archi...28/416185.aspx

----------


## titbasoft

در مورد مشکلات ajax قبلا بحث شده (فکر کنم توی بخش PHP آقای متقی (oxygenws) پست زده بود) متاسفانه هرچی گشتم پیداش نکردم. فکر کنم توی codeproject هم در مورد مشکلات ajax یه مقاله حدود 5 یا 6 ماه پیش دیده بودم.

یکی از بزرگترین مشکلات AJAX اینه که غیر قابل index کردن و در نتیجه عدم شناسایی توسط موتور های جستجوگره. مشکلات امنیتی هم که جای خودشون رو دارند. 

اما در کل من هم موافقم که در نسل آینده (و حتی همین الان) سیستم های web based مفهوم AJAX حرف های زیادی برای گفتن داره.

----------


## Farhad.B.S

*
Anthem.NET
*
یک Control Library فوق العاده برای بهره گیری از قابلیت های این تکنولوژی بدون درگیری با جزئیات.

برای آشنایی حتما این مقاله رو مطالعه کنید :
http://www.codeproject.com/useritems/AnthemNET.asp


پ.ن : دوست عزیز shahramasp ممنون که این بحث رو شروع کردید و دنبالش رو میگیرید.

----------


## shahramasp

Magic AJAX: Applying AJAX to your existing Web Pages

http://www.codeproject.com/Ajax/MagicAJAX/MagicAJAX.zip

----------


## k_a_bahar

من مدتیه که از Atlas استفاده می کنم. کار کردن با کنترلهای سرورساید (مثل Updatepanel) خیلی راحته و نیاز به هیچ کدنویسی اضافی نداره.
قراره تو نسخه بعدی (April CTP) کنترلهای جدیدی به این مجموعه اضافه بشه که البته بیشتر مربوط به طرف کلاینت میشه.
برای داونلود Atlas به آدرس http://atlas.asp.net مراجعه کنید.
ضمنا مایکروسافت یه مسابقه برای بهترین برنامه Atlas گذاشته که XBox 360 جایزه میده!

----------


## adonis

میگم تو دات نت 2003 هم میشه از ajax استفاده کرد؟

----------


## shahramasp

در 2003 نمی دنم دقیق ولی تو 2005 میشه

----------


## shahramasp

باز هم مثال Ajax
http://ajax.schwarz-interactive.de/c...e/default.aspx

http://www.ajaxinfo.com/

----------


## shahramasp

سری دوم 
http://ajaxian.com/
http://del.icio.us/microdump/ajax
http://www-128.ibm.com/developerwork...07AJAX-Request

http://www.maxkiesler.com/index.php/...jax_tutorials/

----------


## adonis

من تمام این کارهایی که توی مقالات گفته شده رو انجام میدم همش این ارور رو میده
Only XML elements are allowed.
که مربوط به اون قسمت handlers توی وب کانفیگ میشه. کسی میتونه کمکم کنه؟

----------


## md_bluelily

در VS.net 2003 هم میشه از AJAX استفاده کرد. خیلی راحت.

ولی Atlas رو ترجیح میدم.

----------


## mamadgmail

سلام
آقای shahramasp  ممنون
در ضمن این یک عکس از نسخه بتا ایمیل یاهو که از این تکنولوژی استفاده می کنه.
چون همونطوری که گفتن این نسخه فقط برای user های غیر رایگان هستش گفتم یک عکس بذارم.

خوش باشید.

----------


## M-Gheibi

> میگم این فرستادن پاسخ سریع تو این سایت هم از Ajax استفاده میکنه؟





> نه دوست من مطمئنا برای فرستادن پاسخ سریع تو این سایت از Ajax استفاده نمی شه


اتفاقا دقیقا از همین تکنولوژی استفاده شده



> میگم تو دات نت 2003 هم میشه از Ajax استفاده کرد؟


استفاده از این تکنولوژی به نرم افزار مورد استفاده شما مربوط نمیشه و در هر محیطی می تونید ازش استفاده کنید.



> آقای shahramasp ممنون
> در ضمن این یک عکس از نسخه بتا ایمیل یاهو که از این تکنولوژی استفاده می کنه.
> چون همونطوری که گفتن این نسخه فقط برای user های غیر رایگان هستش گفتم یک عکس بذارم.


این طور نیست، امکان استفاده از یاهو میل بتا برای همه فراهم است.

----------


## M-Gheibi

اولین سمینار ‌Ajax برگزار شد

----------


## sarasara

سلام!
مرسی به خاطر مطالب خیلی خوبت.
من می خواستم کتابخانه AJAX رو طبق مطلبی که نوشته بودی :"برای استفاده از AJAX ابتدا کتابخانه رایگان آن را از *اینجا* دانلود کنید." دانلود کنم اما لینکش فعال نیست!
اگه می شه لینک دانلود کتابخونه رو بذارید.
باز هم ممنون

----------


## shahramasp

Ajax , ساخت dropdownlist


مقدمه
در این مقاله درباره  Ajax حرف می زنیم (Asynchronous Javascript and Xml)

تمام آنچه که شما باید درباره Ajax بدانید این است که به شما امکان این را میدهد که متد های سمت سرور خود را بدون پست بک کردن صفحه جاری از طریق کد های سمت مشتری صدا بزنید



دریافت کتابخانه Ajax.Net

پیش از هر کاری شما به فایل کتابخانه Ajax.net  نیاز دارید. بعد از دریافت Ajax.DLL را به پروژه خود اضافه کنید.

http://ajax.schwarz-interactive.de/c...e/default.aspx



چه کاری می خواهیم انجام دهیم؟
می خواهیم با استفاده از <select> که از تگ های  html است یک dropdown list بسازیم.
یک dropdownlist که داده هایش را از یک پایگاه داده می آورد.
وقتی که ما یک آیتم را از این منو انتخاب می کنیم کد مربوط به آن آیتم انتخاب می شود به سمت سرور می رود و از بانک اطلاعاتی رکورد های مربوط به این کد را می آورد.مثال:شما یک منو دارید که استانهای کشور ایران نشان می دهد و شما از این استانها استان پارس را انتخاب می کنید حالا شهرهایی که در این استان هستند را باید در یک datagrid  نمایش دهد.در حالت معمولی بعد از انتخاب هر استان صفحه جاری PostBack می شود و دوباره load  می شود با اطلاعات جدید ما می خواهیم با اشتفاده از Ajax کاری کنیم که با انتخاب هر استان اطلاعات مربوطه به آن بدون postback  از سرور گرفته و نمایش داده شود.

Ajax در عمل

اولین کار ما ایجاد منو است که اطلاعات اش را از بانک اطلاعاتی بیاورد و قبل هر کاری باید Ajax را در رویداد page_load مقداردهی اولیه کرد.

private void Page_Load(object sender, System.EventArgs e)
{

 Ajax.Utility.RegisterTypeForAjax(typeof(UsingAjax)  );           

}

در این مقاله ما از Northwind database در sqlserver 2000 استفاده می کنیم.
ما باید از یک متد سمت سرور استفاده کنیم تا اطلاعات گرفته شده از بانک را داخل یک DataSet قرار دهیم.

[Ajax.AjaxMethod]

public DataSet GetDropDownListData()

{

  string query = "SELECT CategoryID,CategoryName FROM Categories ";

  SqlConnection myConnection = new SqlConnection(GetConnectionString());

  SqlDataAdapter ad = new SqlDataAdapter(query,myConnection);

  DataSet ds = new DataSet();

  ad.Fill(ds,"Categories");

  return ds;

}



این متد با مشخصه Ajax.AjaxMethod علامت گذاری می شود.

این معنی اش این است که این متد در سمت Client و به وسیله Client Script ها صدا زده می شود و قابل دسترسی می باشد.



function FillDropDownList()

{

  UsingAjax.GetDropDownListData(FillDropDownList_Cal  lBack);

}



function FillDropDownList_CallBack(response)

{

  var ds = response.value;

  var html = new Array();



  if(ds!= null && typeof(ds) == "object" && ds.Tables!= null)

  {

    for(var i=0;i<ds.Tables[0].Rows.length;i++)

    {

      html[html.length] = "<option value=" +

                          ds.Tables[0].Rows[i].CategoryID + ">"

                          + ds.Tables[0].Rows[i].CategoryName +

                          "</option>";

    }

    document.getElementById("Display").innerHTML =

        "<select id=\"sel\" onchange=\" ChangeListValue" +

        "(this.options[this.selectedIndex].value); \">" +

        html.join("") + "</select>";

  }

}





این تگ Html  باید در مکانی باشد که می خواهیم منو را نمایش دهیم.



<span id="Display"></span>



زمانی که آیتم جدیدی انتخاب می کنیم این متد صدا زده می شود.

function ChangeListValue(index)

{

  GetResult(index);

}



function GetResult(categoryID)

{

  UsingAjax.GetProductsByID(categoryID,GetResult_Cal  lBack);

}



function GetResult_CallBack(response)

{

  var ds = response.value;

  if(ds!=null && typeof(ds) == "object" && ds.Tables!=null)

  {

    var s = new Array();

    s[s.length] = "<table border = 1>";



    for(var i=0;i<ds.Tables[0].Rows.length;i++)

    {

        s[s.length] = "<tr>";

        s[s.length] = "<td>" + ds.Tables[0].Rows[i].ProductID + "</td>";

        s[s.length] = "<td>" + ds.Tables[0].Rows[i].ProductName + "</td>";

        s[s.length] = "<td>" + ds.Tables[0].Rows[i].QuantityPerUnit + "</td>";

        s[s.length] = "</tr>";

    }

    s[s.length] = "</table>";



    document.getElementById("Display1").innerHTML = s.join("");

  }

}

متد GetResult() در سمت کلاینت متد GetProductsByID()  در سمت سرور را صدا می زنید.

[Ajax.AjaxMethod]

public DataSet GetProductsByID(int categoryID)

{

  string query = "SELECT * FROM Products WHERE CategoryID = @CategoryID ";

  SqlConnection myConnection = new SqlConnection(GetConnectionString());

  SqlCommand myCommand = new SqlCommand(query,myConnection);



  myCommand.Parameters.Add("@CategoryID",categoryID)  ;

  SqlDataAdapter ad = new SqlDataAdapter(myCommand);

  DataSet ds = new DataSet();



  ad.Fill(ds);

  return ds;

}





زمانی که یک آیتم انتخاب می شود رکورد های مربوط به آن که از سمت بانک اطلاعاتی می آید باید در یک Datagrid نمایش داده شود و این کار توسط متد BindControls()  انجام می شود.

function BindControls()

{

  FillDropDownList();

}

زمانی که صفحه لود می شود باید این متد صدا زده شود.

<body onload="BindControls();">



در قسمت آخر شما باید در  فایل web.config این تنظیمات را اضافه کنید.

<configuration>

  <system.web>

    <httpHandlers>

      <add verb="POST,GET " path="ajax /*.ashx"

           type="Ajax.PageHandlerFactory, Ajax" />

    </httpHandlers> 

    ...

  <system.web>

</configuration>

اینم یه نمونه ایرانی http://www.mihannic.com/#domain  !!!

کتابخانه ASP.NET Atlas


مقدمه
ASP.NET Atlas  کتابخانه ای پربار، هم در سمت سرور و هم در سمت Client   برای پیاده سازی برنامه های  بر مبنای AJAX است. این مقاله یک دید عمومی نسبت به امکانات اطلس (Atlas) به شما خواهد داد. چون اطلس یک کتابخانه بسیار گسترده است این مقاله دو امکان بسیار مهم اطلس را معرفی میکند:

1.      امکان صدا کردن یک web service  از طریق یک اسکریپت در سمت Client
2.      سهولت استفاده  از javaScriptهایی که در تمام مرورگرهای وب اجرا میشوند.

 پیش زمینه

نقاشی از طریق وب همواره برای کاربران، از جمله من جالب بوده است. این برنامه به کاربر اجازه میدهد که با کمک موس روی صفحه نقاشی کند البته در مرورگرهای وب. نمونه این برنامه در سایت JavaScript Draw  موجود است ولی تنها بروی Mozilla Firefox  قابل اجرا است. ولی کد ذیل با تکنولوژی Atlas محدودیتی روی هیچ مرورگری ندارد.

 نصب Atlas
هم اکنون ( زمان نوشتن این مقاله) شما میتوانید نسخه ماه دسامبر Atlas  را از اینجا بردارید. اگر این لینک وجود نداشت، میتوانید از وب سایت Atlas لینک درست را بردارید. کتابخانه Atlas فایل با پسوند .vsi ( تمپلت Visual Studio 2005) موجود است. کافی است که روی فایل در دستگاه خود ( که Visual Studio 2005  را روی آن نصب کرده اید) دبل کلیک کنید تا براحتی نصب شود.

ساخت یک پروژه اطلس
 به محض اینکه اطلس را نصب کردید میتوانید یک پروژه اطلس را با رفتن به منوی File -> New-> Web Site  . بعد از اینکار صفحه زیر پدیدار میشود:

image001.jpg 

در قسمت Location دو حالت File System  یا HTTP  قابل انتخاب است. با انتخاب HTTP ، میتوانید وب سایت خود را روی IIS Sever  بسازید. و با انتخاب File System  وب سایت شما روب فایل سیستم محلی ساخته میشود ( بدون نیاز به IIS ). شما هر کدام از انتخابها را میتوانید استفاده کنید. ولی به نظر میرسد که برنامه با IE  روی IIS  بهتر کار میکند.



ساختار پروژه اطلس

وب سایت اطلس تازه ساخته شده، چنین ساختاری دارد:

    *
      App_Data
      یک فولدر خالی برای گذاشتن فایلهای داده
    * Bin
      فولدری که dllهای اطلس در آن است. در واقع قسمت سروری کتابخانه اطلس در این فولدر است.
    * ScriptLibrary
      محلی که میتوانید فایلهای JavaScript  خود را در آن بگذارید.
          o Atlas
            اسکریپتهای سمت کلاینت(Client) در این فولدر و در دو زیردایرکتوری قرارمیگیرند.
                + Debug
                  نسخه قابل دیباگ از اسکریپتهای JavaScript در این فولدر قرارمیگیرند
                + Release
                  نسخه قابل عرضه در اینجا قرارمیگیرند. این اسکریپتها خیلی فشرده تر نوشته شده اند و بعضی از کدهای مربوط به دیباگ حذف شده اند.

اسکرپتهای کلاینت اطلس

نسخه ماه دسامبر اطلس شامل اسکریپتهای زیر است:

    * Atlas.js
      هسته اصلی اسکرپتهای اطلس که شامل فانکشنهای کاربردی اولیه و کنترلها و کامپوننتهای سمت کلاینت است.
    * AtlasCompaat.js و AtlasCompat2.js
      لایه سازگار کننده انواع مرورگرهای وب با اطلس در این دو فایل هستند.
    * AtlasRuntime.js
      نسخه خلاصه Atlas.js  که شامل  کنترلها و کامپوننتهای سمت کلاینت نیست.
    * AtlasUIDragDrop.js
      ابزارهایی برای پیاده کردن Drag & Drop  در صفحات وب درون این فایل است.
    * AtlasUIGlits.js
      ابزارهایی برای پیاده کردن جلوه های ویژه و انیمیشن در وب سایت درون این فایل است.
    * AtlasUIMap
      ابزارهایی برای استفاده از Virtual Earth

 فایلهای دیگر

پروژه اطلس فایلهای ذیل را نیز به ریشه پروژه اضافه میکند:

    * Default.aspx  و  Default.aspx.cs
      صفحه وبی است که شامل کنترل Script Manager  است که مسوولیت پردازش بلاکهای اسکریپت مربوط به سمت کلاینت میباشد. یک اسکریپت سمت کلاینت که از نوع test/xml-script  است به صفحه اضافه میشود. این اسکریپت برای نوشتن اسکریپتها با استفاده از XML  استفاده میشود.
    * Eula.rtf
    * Readme.txt
    * Web.Config

این فایل برای اجرای پروژه اطلس لازم است. این فایل شامل تنظیماتی مخصوص اطلس است.

توضیح کد

با این برنامه کاربر قادر است روی صفحه با فشردن کلید چپ موس، خط بکشد. زمانی که کاربر کلید موس را رها میکند یا موس را به بیرون از صفحه میبرد، کشیدن خط به انتها میرسد. راه دیگری برای کشیدن خط با استفاده از JavaScript  و VML  وجود دارد ولی ما از VML  استفاده نمیکنیم.
صفحه Default  یک عکس ( از نوع عکس HTMLی – تگ IMG) خواهد داشت. رویدادهای موس بر روی عکس، توسط JavaScript  گرفته میشود. JavaScript   یک سری نقطه ( نقطه های که در مسیر حرکت موس هستند ) را به web service  میفرستد. Web service  عکس را با کشیدن خطهایی بین تمام نقطه هایی که کلاینت فرستاده است،  بروزرسانی میکند و آنرا در Session  قرار میدهد. در نهایت، کلاینت ( Client) یک درخواست برای عکس بروزشده به سرور میفرستد. منبع عکس، یک HTTP handler است که عکس را بصورت یک جریان ( stream )  از session  گرفته و به کلاینت میفرستد.کامپوننتهای اصلی نرم افزار ما به شرح ذیل هستند:

&#183;        Default.aspx
صفحه ای که شامل عکس پویا و کنترل مدیریت اطلس ( Atlas Script Manager control) است.

&#183;        ScribbleImage.ashx
یک HTTP handler  که عکس ذخیره شده در Session را بصورت جریان ( stream) در می آورد.

&#183;        ScribbleService.asmx
Web service ی که تمام درخواستها به آن داده میشود. این web service  عکس را تغییر میدهد.

&#183;        Scribble.js
کدهای JavaScript  نرم افزار که درون یک فایل قرار داده شده اند.

&#183;        Global.asax
رویدادهای Session_Start و Session_End در این فایل کنترل میشوند. Session_Start  یک متغیر Session  ایجاد میکند و Session_End عکس ذخیره شده در
Session را از حافظه خارج میکند ( Dispose )
  Global.asax

            ما کد نویسی خود را از فایل Global.asax شروع میکنیم.

1.      در منوی Website  روی Add New Item  کلیک کنید یا کلیدهای Ctrl + Shift + A  را بفشارید.

2.      در پنجره Add New Item ، Global Application Class  را انتخاب و ok را کلیک کنید. شما باید فایل Global.asax را ببینید که ایجاد شده است.

3.      حال باید System.Drawing  را به این فایل اضافه کنید. خط زیر را در ابتدای فایل بگذارید:



<%@ Import Namespace="System.Drawing" %>  



            کد زیر را به Session_Start  اضافه کنید:

void Session_Start(object sender, EventArgs e)
{
    Bitmap bmp = new Bitmap(200, 200);
    using (Graphics g = Graphics.FromImage(bmp))
    {
        g.FillRectangle(new SolidBrush(Color.White),
            new Rectangle(0, 0, bmp.Width, bmp.Height));
        g.Flush();
    }
    Session["Image"] = bmp;
}

4.این کد یک عکس ( bitmap ) 200 در 200 پیکسل برنگ سفید ایجاد میکند و آنرا درون متغیری به نام Image  در Session  میگذارد.

5. فانکشن Session_End  این عکس را آزاد میکند.

Bitmap bmp = (Bitmap)Session["Image"];

bmp.Dispose();



            6. از منوی Website ،  Add Reference  را انتخاب کنید.

            7. در Add Reference ،  System.Drawing  را انتخاب و Ok  کنید.

8. در نهایت از منوی Build، Build Web Site  را انتخاب کنید و یا Ctrl + Shift + B  بفشارید تا مطمئن شوید اشکالی در کد وجود ندارد.

ScribbleImage.ashx

وظیفه این web handler  این سات که عکس ذخیره شده در session را به صورت جریان ( Stream)  به کلاینت برگرداند.

1. در منوی Website  روی Add New Item  کلیک کنید یا کلیدهای Ctrl + Shift + A  را بفشارید.

2. در پنجره   Add New Itemvg
Generic Handler را انتخاب و اسم آنرا ScribbleImage.ashx  بگذارید.

3.      برای اینکه یک web handler بتواند از متغیر session  استفاده کند باید Interface ، IrequiresSessionState   را پیاده کند. نیازی برای پیاده سازی ( override) هیچ متدی از این اینترفیس نیست و فقط کافی است که معرفی شود. خطی که کلاس را تعریف میکند به این شکل تغییر دهید:

public class ScribbleImage : IHttpHandler,

    System.Web.SessionState.IRequiresSessionState

4.      حال این کد را به ProcessRequest  اضافه کنید:



public void ProcessRequest (HttpContext context)

{

    context.Response.ContentType = "image/png";

    context.Response.Cache.SetNoStore();

    context.Response.Cache.SetCacheability(HttpCacheab  ility.NoCache);

    context.Response.Cache.SetExpires(DateTime.Now);

    context.Response.Cache.SetValidUntilExpires(false)  ;



    System.Drawing.Bitmap bmp =

        (System.Drawing.Bitmap)context.Session["Image"];



    lock(bmp)

    {

        using (MemoryStream ms = new MemoryStream())

        {

            bmp.Save(ms, ImageFormat.Png);

            ms.Flush();

            context.Response.BinaryWrite(ms.GetBuffer());

        }

    }

    }

}



&#183;        خط نخست، ContentType  را برابر image/png قرار میدهد. این کار باعث میشود که مرورگر وب جواب دریافتی از سرور را بصورت png  بشناسد( بجای HTML).

&#183;        چهار خط بعدی به مرورگر وب تذکر میدهد که response  را نباید Cache  کند. هر چهار خط باید نوشته شود تا مطمئن شویم این کد روی انواع مرورگرها عمل میکند.

&#183;        در نهایت عکس داخل Session  در داخل یک حافظه( memeory stream ) قرار میگیرد و محتوای حافظه روی response  نوشته میشود. متد BinaryWrite را برای اینکار استفاده میکنیم  چرا که عکس، یک داده باینری است.





ScribbleServic.asmx

حال ما ابزاری برای ایجاد اولیه عکس در session و فرستادن آن به شکل response  داریم. نیاز بعدی ما متدی است که خود عکس را عوض کند. ما از کلاینت انتظار صدا کردن web service، ScribbleServic.asmx  را برای کشیدن خطها داریم.



1.       در منوی Website  روی Add New Item  کلیک کنید یا کلیدهای Ctrl + Shift + A  را بفشارید.

2.      در پنجره Add New Item ، Web Service  را انتخاب و پس از مشخص کردن نام ScribbleService.asmx  کلید ok  را بفشارید. مطمئن شوید که گزینهPlace Code in a Separate File  را غیر فعال است.

3.      خط زیر را به کد اضافه کنید:

Using System.Drawing;



4.      در قدم بعدی باید یک کلاس برای point  تعریف کنیم.  توجه کنید که نمیتوانیم از System.Drawing.Point  استفاده کنیم زیار این کلاس XML serializable  نیست.  کد زیر را درست قبل از قسمت تعریف کلاس ScribbleService  بگذارید.



public class Point

{

   public int X;

   public int Y;

};  



5.      در نهایت، باید متدی بنویسیم که با استفاده از مجموعه ای از نقاط، نقاشی کند. وب متد Draw  به همین منظور به web service  اضافه میکنیم.



[WebMethod(EnableSession = true)]

public void Draw(Point[] points)

{

    Image scribbleImage = (Image)Session["Image"];

    lock(scribbleImage)

    {

        using (Graphics g = Graphics.FromImage(scribbleImage))

        using(Pen p = new Pen(Color.Black, 2))

        {

            if (points.Length > 1)

            {

                int startX = points[0].X;

                int startY = points[0].Y;



                for (long i = 1; i < points.Length; i++)

                {

                    g.DrawLine(p, startX, startY,

                        points[i].X, points[i].Y);

                    startX = points[i].X;

                    startY = points[i].Y;

                }

            }

        }

    }

}

&#183;        WebMethod(EnableSession = true )  امکان دسترسی به متغیرهای session را به web service  میدهد.

&#183;        عکس به حالت قفل درمی آید تا مشکلات استفاده همزمان پیش نیاید.

&#183;        خود عمل نقاشی، کاملا ساده است. تنها کار لازم وصل کردن نقاط به همدیگر است.



Scribble.js

تمام کدهایی که برای سمت سرور است، نوشتیم. حال نوبت به اسکریپتی در سمت client  داریم که نقاط را از رویداد موس گرفته و به web service  تحویل دهد.

1.      در solution explorer، فولدر ScriptLibrary  را انتخاب کنید.

2.      در منوی WebSite  روی Add New Item کلیک کنید و یا Ctrl + Shift + A  را بفشارید.

3.      در پنجره Add New Item، Jscript File  را انتخاب و نام را Scribble.js  تعیین کرده و Ok  را بفشارید. با اینکار فایل Scribble.js  را درون فولدر ScriptLibrary   قرار دادید.

4.      در قدم بعدی باید چند متغیر عمومی تعریف کنیم.

//The HTML image element that is to be drawn

var image;

//The source of the image

var originalSrc;

//The number of iteration

var iter = 0;

//The array of points

var points = null;



توضیحات بالای هر تعریف متغیر، هدف هر کدام را توضیح میدهد. متغیر iter  برای تغییر منبع عکس، بعد از هر بار درخواست از سرور است. برای مرورگر IE  ، image.src = image.src  عکس را بروز میرساند ولی همین کد در Firefox  کار نمیکند. برای حل این مشکل ما متغیر iter  را تعریف و بعد از هر درخواست کلاینت به سرور، یکی به مقدار آن اضافه میکنیم. با اضافه کردن این عددبه متغیر originalSrc ، مرورگر فکر میکند که هر بار باید اطلاعات جدید را، بجای عکس Cache شده از سرور بگیرد.

5.      یک فانکشنن به نام startStroke  تعریف میکنیم  تا در زمان رویداد mousedown اجرا شود.



function startStroke()

{

    points = new Array();

    window.event.returnValue = false;

}



وقتی کاربر شروع به نقاشی میکند. ما یک مجموعه از نقاط میسازیم(خط اول). خط دوم عمل پیش فرض رویداد را باطل میکند. این کار لازم است زیرا پیش فرض رویداد mousedown برای یک عکس، شروع عمل Drag & Drop و جلوگیری از پیش آمدن رویدادهای دیگر است.

6. وقتی عمل نقاشی با صدا شدن رویداد mouseup یا رویداد  mouseout  تمام میشود، میباید متد web service  را صدا کنیم. این عملیات با فانکشن endStroke انجام میشود.



function endStroke()

{

    if (!points || points.length < 2)

        return true;



    //Send the points to the webservice

    ScribbleService.Draw(

points,onWebMethodComplete,onWebMethodTimeout,onWe  bMethodError);

    points = null;

    window.event.returnValue = false;

}

قسمت جالب این کد خط

 ScribbleService.Draw(

points, onWebMethodComplete, onWebMethodTimeout, onWebMethodError); 



است که متد Draw  از webservice  را بصورت غیرهمزمان صدا میزند. این فانکشن بصورت اتوماتیک توسط محیط اطلس قابل دسترس است.

7. onWebMethodError فانکشنی است که در زمان بوجود آمدن مشکل در web service  صدا زده میشود.و متد onWebMethodTimeout زمانی فعال میشود که صدا زدن متد web service  از زمان مشخص قابل تنظیمی بیشتر طول بکشد( این زمان در فریم ورک اطلس قابل تنظیم است).



function onWebMethodError(fault)

{

    alert("Error occured:\n" + fault.get_message());

}



function onWebMethodTimeout()

{

    alert("Timeout occured");

}



8. متد onWebMehtodComplete  زمانی صدا زده میشود که صدا زدن web method با موفقیت انجام پذیرید. در این مرحله عکس باید دوباره load  شود.



function onWebMethodComplete(result, response, context)

{

    //We need to refresh the image

    var shimImage = new Image(200, 200);

    shimImage.src = originalSrc + "?" + iter++;

    shimImage.onload = function()

    {

        image.src = shimImage.src;

    }

}



ما یک متغیر shimImage از نوع Image  میسازیم و منبع آن را منبع اصلی عکسی را که کشیدیم قرار میدهیم. وقتی شی عکس بارگذاری میشود، و منبع ( source ) عکس HTML  واقعی را، برابر یک شی image موقت قرار میدهیم. این کار برای جلوگیری از پرش عکس انجام میشود.

9. لازم است که زمان رویداد mousemove  آرایه نقاط را پر کنیم. این کار بار فانکشن addPoints انجام میگیرد.

function addPoints()

{

    if (points)

    {

        var point = { X : window.event.offsetX,

            Y : window.event.offsetY};

        points.push(point);



        if (points.length == 3)

        {

            endStroke();

            points = new Array();   

            points.push(point);

        }



        window.event.returnValue = false;

    }

}



o       نقطه جدید با استفاده از دو مشخصه offsetX  و offsetY از شی رویداد  ساخته شده و سپس به آرایه points  اضافه میشود. دو مشخصهoffsetX  و offsetY موقعیت نسبی موس را در المنت HTMLی را میدهد.

o       وقتی طول آرایه به 3 رسید، ما بصورت اتوماتیک درخواست را به سرور میفرستیم تا نقاشی انجام شود و آرایه را خالی میکنیم. این کار برای اینکه کاربر در حین حرکت موس، نقاشی را ببینند انجام میدهیم.

10. در انتها فانکشنهای نوشته شده باید به رویدادها بچسبند.

function pageLoad()

{

    var surface = document.getElementById("drawingSurface");

    image = surface.getElementsByTagName("IMG")[0];

    originalSrc = image.src;



    surface.attachEvent("onmousedown", startStroke);

    surface.attachEvent("onmouseup", endStroke);

    surface.attachEvent("onmouseout", endStroke);

    surface.attachEvent("onmousemove", addPoints);

}



    * فانکشن  pageLoad یک فانکشن مخصوص است که بعد از بارگذاری کامل فریم ورک اطلس اجرا میشود. ما از این فانکشن بجای رویدادهای معمول window یا body استفاده میکنیم تا مطمئن شویم که فریم ورک بارگذاری شده است.
    * المنت عکس درون HTML درون یک تگ  div  قرار گرفته که نام آن drawingSurface  است. اندازه آن دقیقا برابر عکس ما است ( 200 در 200) بنابراین با خیال راحت میتوانیم رویدادها را به div  بچسبانیم.



Default.aspx

کامپوننتهای ما باید درون صفحه Default.aspx  قرار بگیرند. کد این صفحه به شرح ذیل است:



<%@ Page Language="C#‎" AutoEventWireup="true" CodeFile="Default.aspx.cs"

    Inherits="_Default" %>



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"

    "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title>Atlas Scribble Sample</title>

</head>

<body>

    <form id="form1" runat="server">

        <Atlas:ScriptManager ID="AtlasScriptManager" runat="server"

            EnableScriptComponents="False" >

    <Services>

    <Atlas:ServiceReference Path="ScribbleService.asmx" />

    </Services>

    <Scripts>

    <Atlas:ScriptReference Path="ScriptLibrary/Scribble.js" />

    </Scripts>

    </Atlas:ScriptManager>

        <div id="drawingSurface"

            style="border:solid 1px black;height:200px;width:200px">

        <img alt="Scribble" src="ScribbleImage.ashx"

            style="height:200px;width:200px" galleryimg="false" />

        </div>

    </form>

</body>

</html>



مهمترین هدف این صفحه کنترل سروری atlas:ScriptManager است. کنترل سروری ScriptManager مسوول ایجاد کدهای سمت کلاینتی برای اطلس و هر گونه کد مربوط به web service  است. با هم استفاده از این کنترل را در Default.aspx  بررسی میکنیم:

1.      مشخصه EnableScriptComponents برابر با false  میشود. این کارباعث میشود که بجای Atlas.js  از AtlasRuntime.js  استفاده شود. ما نسخه جمع و جور تر فریم ورک را ترجیح میدهیم زیرا استفاده ای از کامپوننتها یا کنترلهای اطلس نکرده ایم.

2.      ما یک serviceReference به web service خودمان، ScribbleService.asmx  داده ایم.این کار URL  دسترسی به این web service   را درون اسکریپتهای کلاینتی میگذارد.

3.      همچنین Scribble.js  را نیز معرفی کرده ایم.

این صفحه تمام کارهای ما را یک جا میکند. حال خود باید نتیجه کار را با اجرا کردن این کدها ببینید.



جادوی اطلس

            کارهایی که اطلس برای ما انجام میدهد:

1.      اطلس به ما اجازه میدهد نرم افزارهای وبی را بدون نگرانی از نوع مرورگرها بنویسیم. صدا زدن web service  و استفاده از رویدادهای سمت کلاینت روی هر دو مرورگر IE  و Firefox  کار میکند. اطلس به صورت اتوماتیک تعریفات لازم را روی شی های Firefox  انجام میدهد تا آنها شبیه شی های IE  شوند. برای دیدن چگونگی این کار فایلی AtlasCompat.js  را ببینید.

2.      اطلس به طور اتوماتیک یک کد JavaScript  برای web service  ما میسازد.



کجا هستیم

ما دیدیم که چگونه میتوانیم با کمک اطلس یک web service  را از سمت کلاینت صدا بزنیم بدون نگرانی از نوع مرورگر.



دانلود و اجرای کد

1.Atlas Web Site  را دانلود و نصب کنید.

2. بعد از اینکار یک web site  اطلس را بسازید ( از منوی File->New  و انتخاب ASP.NET ‘Atlas’ Web Site  )

3.  فایل کد ما را بعد از دانلود، باز کرده  و در یک فولدر جدید بریزید.

4. در منوی Website  گزینه Add Existing Item  را انتخاب و فایلهای ScribbleService.asmx و ScribbleImage.ashx را به ریشه پروژه اضافه کنید. و فایلهای Scribble.js  و ScriptLibary  را به فولدر ScriptLibrary اضافه کنید.

5. Web site  را اجرا کنید

----------


## Arminizer_88

مرسی. خیلی جالب و مفید بود تمام پست ها.
من خیلی منتظر بودم یکی بحث Ajax رو شروع کنه! من خودم دارم با Atlas کار میکنم ولی خوب تازه کارم. فقط یه خواهش کوچیک هم دارم:

اینکه اگه بشه کدها و توضیحاتی رو که میفرستید به صورت PDF هم در بیارید عالی میشه.

بازم ممنون و خسته نباشید!

----------


## manager

> میگم تو دات نت 2003 هم میشه از ajax استفاده کرد؟


شما حتی در صفحات ساده HTML هم می تونید از این تکنیک استفاده کنید و هیچ ربطی به پلت فورمی که بر روی آن کار می کنید ندارد. Ajax در سمت کلاینت فعالیت می کند و ربطی به چهارچوب کاری سمت سرور ندارد..
اگر منظورتون وجود امکاناتی برای استفاده راحت تر از این تکنیک است باید بگم در دات نت 2005 شما می تونید از client callback استفاده کنید که به عبارت ساده تر فراخوانی متد های Asp.net و سمت سرور در سمت کلاینت و با Javascript هست..با استفاده از این تکنیک شما می تونید حتی اشیاء را از متد سمت سرور خودتون به سمت کلاینت بازگشت بدید, این واقعا خوبه !!

----------


## shahramasp

با اینکه خیلی کم استقبال می کنید ولی .... این هم یه نمونه کد 

<%@ Page Language="C#‎" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head id="Head1" runat="server">
    <title>ASP.NET &quot;Atlas&quot; Control Sample</title>
    <link href="intro.css" type="text/css" rel="Stylesheet" />
</head>

<body>
    <form id="form1" runat="server">
        <div>
            <atlas:ScriptManager runat="server" ID="ScriptManager1" />
            <div id="Div1" class="title">
                <h2>ASP.NET &quot;Atlas&quot; Demo: Sys.Control</h2>
                This page contains ASP.NET &quot;Atlas&quot; script that simply demonstrates the 
                use of ASP.NET &quot;Atlas&quot; controls and their OM. The ASP.NET &quot;Atlas&quot; controls 
                are associated to markup elements and are used to declaratively set 
                properties, and attach to and listen to events.
            </div>
            <hr />
            <hr />
            <div class="description">
                <h3><u>Example 1:</u></h3>
                <div id="panel">
                    This panel (div element) will be affected by color selection.
                </div>
                <br />
                Select a color for the panel:&nbsp;<select id="colorSelect" class="itemselect">
                    <option value="normal">Normal</option>
                    <option value="red">Red</option>
                    <option value="blue">Blue</option>
                    <option value="notset">NotSet</option>
                </select>
                <span id="colorLabel"></span>
                <hr />
                <h3><u>Example 2:</u></h3>
                <input id="textBox" type="text"/>
                &nbsp;&nbsp;
                <input type="button" id="visibilityButton"  class="buttonstyle"
                    value="Toggle Visibility Property" />
                &nbsp;&nbsp;
                <input type="button" id="enabledButton" class="buttonstyle"
                    value="Toggle Enabled Property" />

                <hr />
            </div>

            <script type="text/xml-script">
                <page xmlns:script="http://schemas.microsoft.com/xml-script/2005">
                    <components>
                        <control id="panel" cssClass="normal">
                            <bindings>
                                <binding id="setCss" dataContext="colorSelect" dataPath="selectedValue" property="cssClass" /> 
                            </bindings>
                        </control>
                        <select id="colorSelect">
                            <selectionChanged>
                                <invokeMethod target="setCss" method="evaluateIn" />
                                <setProperty target="colorLabel" property="text" value="Selected color" />
                            </selectionChanged>
                        </select>
                        <textBox id="textBox" text="Simple text box control" cssClass="textBox">
                            <bindings>
                                <binding id="setEnabled" dataContext="textBox" dataPath="enabled" property="enabled" transform="Invert" automatic="false" />
                                <binding id="setVisibility" dataContext="textBox" dataPath="visible" property="visible" transform="Invert" automatic="false" />
                            </bindings>
                        </textBox>
                        <button id="visibilityButton">
                            <click>
                                <invokeMethod target="setVisibility" method="evaluateIn" />
                            </click>
                        </button>
                        <button id="enabledButton">
                            <click>
                                <invokeMethod target="setEnabled" method="evaluateIn" />
                            </click>
                        </button>
                        <label id="colorLabel" text="" />
                    </components>
                </page>
            </script>
        </div>
    </form>
</body>
</html>



Atlas

یادتون نره اول Atlas  رو نصب کنید

----------


## titbasoft

ورژن کنونی : 6.7.20.1

----------


## jannati

ممنون از محبتتون
من این فایل رو دانلود کردم و dllها رو به پروژه ام اضافه کردم.اما فعلا وقتی دارم یه برنامه ساده مینویسم خط:

[Ajax.AjaxMethod()]

را قبول نمیکنه و میگه که این متد در کلاس ajaxنیست.
کسی میتونه راهنمایی کنه؟

----------


## jannati

ببخشید.من کدهای مربوط به Dropdownها رو تا حدی پیش رفتم.اما از جایی که تابعFilldropdownlistشروع میشه دیگه نمیشه فهمید کجا و چطور باید بقیه کدها رو گذاشت.کسی میتونه راهنمایی کنه؟

----------


## jannati

من همون مثال ساده اول این تاپیک رو هم نمیتونم اجرا کنم.یعنی صفحه اجرا میشه.اما کاری صورت نمیگیره.جناب shahramasp لطفا یه نگاهی  به این تاپیک بندازید.

----------


## shima2006

ممنون از توضیحاتی که درباره AGax  در اختیارمون قرار دادید
 با همه تعاریفی که کردید فکر استفاده از این تکنولوژی مو رو به تن آدم سیخ میکنه !!!

----------


## مهدی کرامتی

دیروز داشتم سایت مایکروسافت و پروژه Atlas رو مرور میکردم. کلی مشعوف شدم وقتی اولین پروژه مبتنی بر Ajax و ASP.NET ام رو 5 دقیقه بعد از خواندن Document های مربوطه ایجاد کردم، چه کیفی داشت!

استفاده از Ajax در ASP.NET به سادگی انداختن چند کامپوننت بر روی فرم و تنظیم یک Property است. بعدش دیگه برو دنبال کارت! فکر نمیکردم اینقدر ساده باشه.

بد نیست شما هم یک سری بزنید و خلاصه حالی به حولی: http://atlas.asp.net

----------


## omideiran

> ممنون از محبتتون
> من این فایل رو دانلود کردم و dllها رو به پروژه ام اضافه کردم.اما فعلا وقتی دارم یه برنامه ساده مینویسم خط:
> 
> [Ajax.AjaxMethod()]
> 
> را قبول نمیکنه و میگه که این متد در کلاس ajaxنیست.
> کسی میتونه راهنمایی کنه؟


 سلام ببخشید 
شما با این مشکل چه کردی؟
میشه به ما هم بگویید

----------


## hamid_h671

دوست عزیز shahramasp)) من که مدتها دنبال کار کردن با AJAX   بودم واقعا از توضیحات شما لذت بردم و لطفا باز هم مثال های بیشتری را ارائه نمایید . از اینکه تجربیات خودتون رو در اختیار دیگران می گذارید ممنونم این کار شما بر خلاف روش سایر ایرانی های برنامه نویس است که همه چیز رو انحصاری برای خودشون می خوان .

----------


## mahmoodvb

مطالب فارسی جمع آوری شده در باره تکنولوژی Ajax و نیز مراجع و منابع موجود 

60 صفحه و فرمت Pdf

................

----------


## jannati

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

----------


## mahdi_negahi

لینک بالا یک مال سایت دیگری است باید آنجا هم ثبت نام کنید

----------


## dot_net_lover2

> استفاده از Ajax در ASP.NET به سادگی انداختن چند کامپوننت بر روی فرم و تنظیم یک Property است. بعدش دیگه برو دنبال کارت! فکر نمیکردم اینقدر ساده باشه.
> 
> بد نیست شما هم یک سری بزنید و خلاصه حالی به حولی: http://atlas.asp.net


حتما بعد از مراجعه به سایت فوق این Video را Download کنید .
http://download.microsoft.com/downlo..._net_atlas.wmv

پس از مشاهده هم به ویژگی های Atlas پی خواهید برد و هم به قدرت بالا و سهولت در استفاده از آن.

جهت بهره گیری از Atlas ٬ فایل زیر را Download و سپس نصب نمایید.
http://download.microsoft.com/downlo...AtlasSetup.msi

توضیحات مرتبط با این تاپیک :
http://msdn.microsoft.com/msdnmag/is...t/default.aspx

----------


## shahram1980

خیلی عالی !! 
خیلی وقت بود به این جا سر نزده بودم روزی که این تاپیک را ایجاد کردم فکر نمی کردم اینقدر استقبال بشه . از همه ممنونم و از همه تقاضا دارم که کمک کنن که این یه تاپیک پر با ر در زمینه اجکس بشه .
متشکرم

----------


## dot_net_lover2

اگر کلیپی را که در پست قبلی Link دادم مشاهده کرده باشید ٬ متوجه خواهید شد که مثلا در هنگام ارسال پاسخ در همین سایت از این تکنولوژی استفاده شده و جمله"نوشته شما ..." که در هنگام ارسال مشاهده میکنید یک Progress است که نیز با این تکنولوژی پیاده سازی شده است.

----------


## ealireza

سلام دوستان 
من اخیرا روی یک پروژه بنام ALI FRAMEWORK کارکردم و تغریبا تمام شده .

مثل AJAX PRO هست 
اما به برنامه امکان BACK - FORWARD و حتی Book Mark میده 

کارکردن باهاش هم خیلی سادست .

تموم شد میزارم تستش کنید.


موفق باشید

----------


## monster_ant

من از magicajax در طراحی صفحاتم استفاده کردم...... برای نمایش تصویر loading یا هموم please wait در هنگام لود صفحه از کد جاوا اسکریپت زیر استفاده کردم که قبل از تگ <form/> میگیره.....



<scripttype="text/javascript">

var elem = document.createElement("div"); 

elem.style.position = 
'absolute'; 

elem.style.height = 17; 
elem.style.paddingLeft = "3px"; 

elem.style.paddingRight = "3px"; 

elem.style.fontSize = "11px"; 

elem.style.fontFamily = 'Arial, Verdana, Tahoma'; 

elem.style.border = "#000000 0px solid"; 

elem.style.backgroundColor = "white"; 

elem.style.color = "Blue"; 

elem.innerHTML = ' &nbsp; &nbsp;&nbsp; &nbsp;&nbsp;'+'<img src="../../img/loading.gif" border="0" >'+'<br/>'+'&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'+'Loading....'+'<br/>'//add your message here 

elem.style.visibility = 'hidden'; 

document.body.insertBefore(elem, document.body.firstChild); 
waitElement = elem; 
</
script>

 



حال سوال من اینه که چه چوری میشه این تصویر رو وسط صفحه نمایش داد.... چون هر کاری کردم تغییر مقدار elem.style.top تاثیری در بر نداشت....... باتشکر..

----------


## shahramasp

برنامه های وب مبتنی بر سرویس گیرنده : AJAX و Atlas
 یکی از ویژگی های مهم برنامه های وب ، تبعیت آنان از معماری "سرویس گیرنده - سرویس دهنده"  است . این بدان معنی است که پیاده کنندگان برنامه های وب می توانند به منظور تحقق پردازش های سمت سرویس دهنده و سرویس گیرنده از فن آوری های متعددی استفاده نمایند. یکی از نکات مهم در خصوص انجام پردازش های سمت سرویس گیرنده ، میزان وابستگی آنان به اطلاعات موجود در سمت سرویس دهنده است . به عبارت دیگر ، اجرای یک event handler در سرویس گیرنده تا چه میزان وابسته به کد سمت سرویس دهنده است و  به منظور انجام آن چه میزان داده می بایست بین سرویس گیرنده و سرویس دهنده مبادله گردد ؟
صرفنظر از این که  به سوال فوق چه پاسخی داده می شود ، واقعیت این است که به منظور مدیریت رویدادهای محقق شده در سمت سرویس گیرنده ، می بایست ملزومات مورد نیاز ایجاد تا پیاده کنندگان بتوانند با استفاده از آنان پردازش های سمت سرویس گیرنده را مدیریت نمایند .

پردازش های سمت سرویس گیرنده از گذشته تاکنون
با توجه به این که پردازش های سمت سرویس گیرنده در برنامه های وب می بایست مستقل از نوع پلت فرم باشند ،  بدیهی است که تمامی تلاش های انجام شده در این عرصه ، می بایست متمرکز بر روی برنامه های مرورگر باشد تا با ایجاد پتانسیل هائی در آنها ، امکان انجام پردازش های سمت سرویس گیرنده فراهم گردد . ظهور زبان های اسکریپت نویسی نظیر جاوااسکریپت و  تجهیز مرورگرها به برنامه های مفسر مربوطه از جمله اقدامات عملی دراین عرصه است . استفاده از زبان جاوااسکریپت به منظور کدینگ پردازش های سمت سرویس گیرنده دارای قدمتی چندین ساله است . در ادامه ، قابلیت های جدیدی به مرورگرها اضافه گردید تا پیاده کنندگان بتوانند به کمک آنان برنامه های وب سمت سرویس گیرنده را ایجاد نمایند . هم اینک ، تمامی مرورگرهای متداول از یک مدل شی گراء موسوم  به DOM ( برگرفته از document object model ) استفاده می نمایند و تعداد اندکی از آنها از یک ویژگی جدید با نام XMLHTTP استفاده می نمایند  که به کمک آن ،  سرویس گیرندگان و سرویس دهندگان می توانند بدون نیاز به انجام یک postback کامل و round trip با یکدیگر و به صورت مستقیم ارتباط برقرار نمایند.
XMLHTTP  ، شامل مجموعه ای API ( رابط برنامه نویسی ) است که امکان ارسال و یا دریافت داده به صورت باینری ، HTML و XML را از سرویس دهندگان وب بر روی اینترنت و به کمک پروتکل HTTP فراهم می نماید .  در مواردی که نیاز به داده موجود در سمت سرویس دهنده می باشد ،  XMLHTTP  به صورت پیوسته اقدام به ارسال درخواست خود برای سرویس دهنده می نماید تا آخرین اطلاعات را بدون نیاز به refresh کردن مدام مرورگرها ، بازیابی نماید . در واقع ، به کمک فن آوری فوق ، سرویس گیرندگان قادر به مبادله غیرهمزمان با سرویس دهنده بوده و می توانند اقدام به ارسال و یا دریافت داده XML بدون نیاز به انجام یک round trip کامل که باعث تولید مجدد یک صفحه می گردد ، نمایند .
ماحصل این تحولات ، ظهور نسل جدیدی از برنامه های وب نظیر  Microsoft Virtual Earth  و   Microsoft Windows Live  است . ایجاد چنین برنامه های وبی کار ساده ای نخواهد بود و پیاده کنندگان می بایست شناخت مناسبی نسبت به جاوااسکریپت و مدل DOM  داشته باشند که ممکن است در هر مرورگر متفاوت باشد . علاوه بر این ، جاوااسکریپت تمامی ویژگی های یک زبان شی گراء را ارائه نمی نماید و بسیاری از ملزومات مورد نیاز پیاده کنندگان برنامه های وب در فریمورک دات نت را تامین نمی نماید ( نظیر type-safe ) .

ایجاد برنامه های وب با تاکید بر انجام پردازش سمت سرویس گیرنده ، نیازمند ملزوماتی نظیر
یک زبان برنامه نویسی و پلت فرم پیاده سازی جدید  است .   

AJAX ( برگرفته از asynchronous JavaScript and XML )
پیاده سازی برنامه های وب با استفاده از فن آوری های اشاره شده ( اسکریپت نویسی سمت سرویس گیرنده و مبادله غیرهمزمان با سرویس دهنده ) ،  AJAX  نامیده می شود . AJAX ، پیاده کنندگان را قادر به تولید صفحاتی می نماید که از توان پاسخگوئی بسیار مطلوبی در سمت سرویس گیرنده متناسب با رویداد ایجاده شده ، برخوردار می باشند . چراکه آنها  از اسکریپت های سمت سرویس دهنده برای دستیابی و مدیریت عناصر بخش رابط کاربر استفاده می نمایند . علاوه بر این ، با توجه به مبادله غیرهمزمان داده به منظور ارسال و دریافت داده ، امکان انجام عملیات مورد نظر بر روی داده بدون وقفه و ازدست دادن state وجود خواهد داشت .  Microsoft Virtual Earth  و برنامه سرویس گیرنده نامه های الکترونیکی Outlook Web Access  ،  دو نمونه از برنامه های سبک AJAX ، می باشند .

Atlas : تلاش‍ی در جهت ایجاد یک  پلت فرم پیاده سازی جامع 
فن آوری جدید ASP.NET با نام Atlas ، مجموعه ای از فن آوری های مایکروسافت را شامل می شود  که با تمرکز بر روی اصول AJAX ، سعی در توسعه و بهبود آن را دارد .
Atlas ، یک فن آوری جدید در عرصه پیاده سازی برنامه های وب ASP.NET است که  کتابخانه های اسکریپت سرویس گیرنده را با فریمورک پیاده سازی مبتنی بر سرویس دهنده ASP.NET 2.0 ترکیب می نماید . در واقع ، Atlas به پیاده کنندگان برنامه های وب یک پلت فرم مناسب به منظور پیاده  سازی صفحات وب مبتنی بر سرویس گیرنده را ارائه می نماید که قبلا" مشابه آن در خصوص صفحات وب مبتنی بر سرویس دهنده توسط ASP.NET ارائه شده بود . با توجه به این که Atlas ، به عنوان یک پتانسیل اضافه در کنار ASP.NET مطرح می باشد ، بدیهی است که کاملا" سازگار با سرویس های مبتنی بر سرویس دهنده باشد . با استفاده از Atlas ، می توان بخش قابل توجهی از پردازش های مورد نیاز یک برنامه را به سمت سرویس گیرنده انتقال داد ( fat-client ) . در چنین مواردی ، امکان ارتباط سرویس گیرنده با سرویس دهنده در background فراهم می گردد. ماحصل این فن آوری ، ایجاد برنامه های وبی است که علاوه بر ارائه امکانات مناسب  در لایه رابط کاربر ( UI ) ، دارای توان پاسخگوئی بالائی می باشند و به سادگی می توانند با سرویس دهنده ارتباط برقرار نمایند .

مفاهیم فنی اولیه AJAX
در AJAX ، پیاده کنندگان می توانند سرویس های وب را بطور غیرهمزمان و از طریق اسکریپت های سمت سرویس گیرنده و با استفاده از شی XMLHTTPRequest  فراخوانده تا اطلاعات به عنوان داده XML بسته بندی و در ادامه آنها را بر روی شبکه ارسال نمایند . بدین منظور شی XMLHTTPRequest یک شی پراکسی را ارائه می نماید تا به کمک آن امکان فراخوانی از راه دور و مبادله داده فراهم گردد . در فن آوری AJAX از زبان های اسکرپیت سمت سرویس گیرنده نظیر جاوااسکریپت بطرز گسترده ای استفاده می گردد . از جاوااسکریپت در مواردی نظیر فراخوانی از راه دور روتین ها ، انجام پردازش های مورد نیاز یک برنامه در سمت سرویس گیرنده و ایجاد ویژگی های پیشرفته ای در سطح لایه رابط کاربر استفاده می شود .
AJAX علاوه بر جاوااسکریپت از چندین فن آوری دیگر در سمت سرویس گیرنده نیز استفاده می نماید :

    *

      DOM : به کمک فن آوری فوق ، عناصر موجود در یک صفحه HTML به عنوان مجموعه ای از اشیاء استاندارد ( نظیر document و windows ) در نظر گرفته می شوند . بدین ترتیب ، امکان دستیابی  و انجام عملیات دلخواه بر روی آنان از طریق کد فراهم می گردد .
    *

      DHTML ( برگرفته از Dynamic HTML ) : فن آوری فوق ، توانمندی HTML را به منظور واکنش مناسب در خصوص عملیاتی که توسط کاربران انجام می شود ( نظیر درج داده ) با استفاده از اسکریپت های سمت سرویس گیرنده و بدون نیاز به یک round trip افزایش می دهد .
    *

      رفتارها ، شامل روشی مناسب به منظور برخورد سیستماتیک با عملیاتی نظیر drag and drop در سطح لایه رابط کاربر و مرتبط با عناصر موجود بر روی یک صفحه می باشد .
    *

      عناصر : اشیاء سفارشی شده جاوااسکریپت می باشند که پتانسیل های توسعه یافته ای را در سمت سرویس گیرنده ایجاد می نمایند . 

چالش های فن آوری AJAX
برنامه نویسی صفحات به سبک AJAX دارای چالش های متعددی است :

    *

      عناصر موجود در صفحات وب می بایست متناسب با شرایط هر مرورگر برنامه نویسی گردند ، چراکه هر مرورگر یک نسخه متفاوت از DOM و DHTML را ارائه می نمایند(هر چند این تفاوت ها اندک باشد) .
    *

      برنامه نویسی سمت سرویس گیرنده صرفا" با استفاده از جاوااسکریپت انجام می شود . پیاده سازی برخی از پتانسیل های  AJAX می تواند برای پیاده کنندگان بسیار پیچیده باشد و نیازمند دانش بالائی در خصوص استفاده از جاوااسکریت است .
    *

      جاوا اسکریپت ،  ویژگی ها و امکانات مورد نیاز پیاده کنندگان برنامه های دات نت را تامین نمی نماید ( نظیر یک رویکرد شی گراء کامل ) . علاوه بر این ، در این فن آوری از کتابخانه ای نظیر آنچه در پلت فرم دات نت ارائه شده است ،‌ استفاده نمی گردد و برنامه نویسان می بایست تمامی برنامه را از ابتدا کد نمایند  .
    *

      جاوااسکریپت و پیاده سازی سمت سرویس گیرنده  ، عموما" بخوبی در IDEs حمایت نمی گردند . 

فن آوری Atlas  ، مسائل اشاره شده را با ارائه یک فریمورک کامل برای ایجاد برنامه های وب مبتنی بر سرویس گیرنده برطرف می نماید.

فن آوری Atlas  ، 
دارای عناصر سرویس گیرنده و سرویس دهنده ای است
 که آن را  به خوبی با ASP.NET یکپارچه و مرتبط می نماید

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

عناصر سمت سرویس گیرنده Atlas
فن آوری Atlas برای پیاده سازی برنامه های سمت سرویس گیرنده ، از مجموعه ای کتابخانه سمت سرویس گیرنده ( فایل هائی با انشعاب Js . ) استفاده می نماید که پیامد آن تعریف یک رویکرد لایه ای برای ایجاد برنامه های مبتنی بر سرویس گیرنده است . این لایه ها عبارتند از :

    *

      لایه مختص  مرورگرها : با استفاده از پتانسیل های ارائه شده توسط این لایه ، اسکریپت های Atlas در اکثر مرورگر سازگار بوده و ضرورتی به نوشتن اسکریت های مختص یک مرورگر وجود ندارد .
    *

      سرویس های هسته atlas : شامل ضمائمی به جاوااسکریپت نظیر کلاس ها ، namespace ، event handler ، توارث ، نوع های داده و تسلسل اشیاء است . ویژگی های فوق یک مدل برنامه نویسی شی گراء را در اختیار پیاده کنندگان قرار می دهد تا به کمک بتوان علاوه بر سرعت در ایجاد برنامه ها از کد تولید شده نیز بدفعات استفاده نمود.
    *

      کتابخانه کلاس پایه Atlas : شامل عناصری نظیر دیباگرها ، Timers ، ردیابی و string buliders است .
    *

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

      لایه UI  : در این لایه قابلیت های سرویس گیرنده Atlas نظیر رفتارها ، گرامر تعریفی Atlas ، عناصر UI و نسبت دهی داده  ارائه می گردد .
    *

      لایه کنترل ها : این لایه کنترل های مختص atlas را برای پیاده سازی سمت سرویس گیرنده ایجاد می نماید . علاوه بر این که می توان از طریق اسکریپت به این کنترل ها دستیابی داشت ، امکان انجام عملیات متفاوتی نظیر نسبت دهی داده نیز وجود دارد. کنترل های  Navigation و data-bound listview نمونه هائی در این زمینه می باشند . 
    *

       یک مدل برنامه نویسی تعریفی که پیاده کنندگان را قادر می سازد عناصر atlas را با روشی مشابه کنترل های سرویس دهنده ASP.NET ایجاد نمایند . 

فن آوری Atlas  را می توان
به عنوان کتابخانه های اسکریپت سرویس گیرنده تصور نمود که زیرمجموعه ای از معماری ASP.NET بر روی ‌سرویس دهنده می باشند

برای پیاده سازی برنامه های وب سمت سرویس گیرنده ، فن آوری Atlas  ویژگی های متعددی را ارائه می نماید . ارائه یک مجموعه API برای پیاده سازی در جاوااسکریپت ، قابلیت سازگاری اتوماتیک با مرورگرها و یک مدل تعریفی برای پیاده سازی سمت سرویس گیرنده ، نمونه هائی در این زمینه م‍ی باشند . 

عناصر سمت سرویس دهنده Atlas
فن آوری Atlas ، صرفا" در ارتباط با اسکریپت های سمت سرویس گیرنده نمی باشد و از عناصر سمت سرویس دهنده ، سرویس ها و کنترل هائی استفاده می نماید که می توانند با اسکریپت های Atlas سمت سرویس گیرنده مرتبط گردند :

    *

      سرویس های وب که ویژگی های ASP.NET نظیر سرویس های پروفایل ، membership ، roles ، personalization  و globalization را ارائه می نمایند .
    *

      کنترل های سرویس دهنده Atlas که کنترل های سرویس دهنده ASP.NET را reasemble می نمایند ولی اسکریپت های سمت سرویس گیرنده Atlas را منتشر می نمایند . این نوع کنترل ها ارتباط بسیار نزدیکی با کنترل های سرویس دهنده ASP.NET نظیر دکمه ها ، Label و ... دارند .
    *

      کنترل های سرویس دهنده Atlas که باعث می گردند جاوااسکریپت رفتارهای سمت سرویس گیرنده را تولید نماید . کنترل های  HoverBehavior  ، ClickBehavior ، Popup و  AutocompleteBehavior نمونه هائی در این زمینه می باشند .
    *

      تمامی کنترل های سرویس دهند atlas در ویژوال استودیو نیر قابل استفاده می باشند. بنابراین می توان از آنان در زمان طراحی استفاده نمود ( همانند کنترل های سرویس دهنده ASP.NET  ) . 

 فن آوری Atlas ، اسکریپت نویسی سمت سرویس گیرنده را با پیاده سازی سمت سرویس دهنده ASP.NET یکپارچه می نماید و پیاده کنندگان می توانند از پتانسیل های ASP.NET در سمت سرویس دهنده برای برنامه های Atlas نیز استفاده نمایند .

----------


## sahar

مزایای استفاده از آجاکس :

وقتی تعداد زیادی فرم و ترافیک زیاد بین سرور و کلاینت داریم.
وقتی می خواهیم حجم زیادی داده را بدون نیاز به رفرش کردن فرم لود کنیم.

وقتی کاربر به طور مرتب از طریق فرم می خواهد قبل ازسابمیت کردن نهایی صفحه، داده ها را برایش نشان دهیم.

وقتی زمان پاسخ گویی اپلیکیشن بالا و مشکل آفرین است .
وقتی می خواهیم زمان لود آخرین دیتا در کوتاه ترین زمان ممکن باشد.





معایب آجاکس :



1- میتواند هزینه و زمان برنامه نویسی را زیاد کند .
2-هنوز کامپوننت های زیادی با این تکنولوژی نوشته نشده.
3-همه مشکلات مربوط به سیکیوریتی و ایمنی پاسخ داده نشده است .

4- عملیات کلیدهای نویگیتور و هیزتوری در اکسپلوررواقعی نیست .چون آدرس عوض نشده ولی دیتا عوض می شود .	


5- مهمترین مشکل این است که بسیاری از کاربران اجازه اجرای جاوا اسکریپت را درIe. نمی دهند.

6- نمی توانید دیتا را از سرور دیگری بجز سرور خودتان بیاورید.

وقتی از آجاکس نمی توانید استفاده کنید :


وقتی صفحات شما استاتیک است .


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


وقتی کاربر سیستم شما ارساال و دریافت زیادی ندارد . مثلا شرکت بسیار کوچک است 


وقتی زمان  و پهنای باند در لود داده ها برایتان مسئله مهمی نیست 



وقتی اپلیکیشن شما چندان دیتای داینامیکی ندارد . 


وقتی تیم پیاده سازی قوی ندارید!!!

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



 وقتی می خواهید دیتا را از سرور دیگری بجز سرور خودتان بیاورید.

http://www.interaktonline.com/Support/Articles/Details

نکته :
آجاکس خالص تکنولوژی آجاکس است که بدون هیچ دی ال ال اضافه خودتان آن را کدنویسی می کنید.
نقطه مقابل آن استفاده از انواع و اقسام دی ال ال های نوشته شده با این تکنولوژی ست که نمی دانید درونش چه خبر است 
و برای یادگیری آن هم باید بیشتراز خود آجاکس خالص وقت بگذارید .



یک مثال ساده و آسان با آجاکس خالص :



Simple Pure Ajax In .Net Frame Work :

با این مثال شما دو  کومبوی  مرتبط با هم را در صفحه وب خود را با تکنولوژی آجاکس پرمی کنید
 :
مثلا داده های استان ها در کومبوی اول است و با تغییر استان ،  داده های شهرستانهای هر استان  با آجاکس در کومبوی دوم لود می شود.


برای راحت فهمیدن آجاکس این سه مرحله را جدا کنید.


1-  فرم اصلی و درخواست داده 
	رفتن به سرور با کلیک روی اولین کومبو. کومبوی استان :
2-  فرم جواب دهنده
ResponsePage.aspx
	تشخیص اینکه درخواست از طرف کدام کومبو و با چه مقداری است-	
 	گرفتن داده های مورد نظر کاربر از بانک
	ارسال برای کاربر با فرمت ایکس ام ال
3- باز گشت به فرم اصلی

	Msxml2.XMLHTTP گرفتن داده ها با اکتیو ایکس
	یا
	Microsoft.XMLHTTP

	پر کردن داده ها با جاوا در کنترل مورد نظر



حالا تشریح این سه مرحله :

1- در فرم اصلی با نام 
WebFrom1.aspx
دو عدد کومبو می گذارید داده های اولی اش را با نام و اندیس استانها پر می کنید و دومی را خالی می فرستید
برای رفتن به سرور با کلیک روی اولین کومبو. کومبوی استان 

برای این کار باید هنگام 
onchange
تابع جاوایی خاصی را صدا بزنیم
برای افزودن این امکان به کومبو :

Dropdownlist1.Attributes.Add("onchange", "return GetDataViaAJAX(Dropdownlist1,Dropdownlist2);");


این تابع جاوایی
(GetDataViaAJAX)
 به صفحه ای در سرور می رود و داده ها را می گیرد.
فرض کنید نام آن صفحه این است :
ResponsePage.aspx

2-حالا به سرور آمده ایم در صفحه 
ResponsePage.aspx
باید بفهمیم در خواست از طرف کدام کومبو به ما شده تا داده های متناسب را حاضر کنیم و بفرستیم.
از کجا بفهمیم ؟  از
 که در کد های جاوایی قبلا خودمان ست کرده ایم QueryString:


string combovalue = Request.QueryString["Dropdownlist1"];



اگر مقداری داشتیم یعنی در خواست کاربر پر کردن شهرستانهای این استان است 


if (combovalue !=null )
{
	Response.Clear();
	Response.ContentType = "text/xml";
	Response.Write(FillShahrestanData( combovalue));
//گرفتن داده ها از اسکیوال سرور و فرستادنش با فرمت ایکس ام ال برای کاربر


	Response.End();

FillShahrestanData
}


تابعی ست که کد استان را می گیرد و شهرستان های متناسب با آن را در یک دیتا تیبل از یک  دیتا ست   پر می کند و آن را به صورت فرمت 
XML
برمی گرداند..
مثلا این طوری :

	public string conectionString = "data source=mySql ;initial catalog=mydatabase;user id=sa ; ";
	
	public string FillShahrestanData(string combovalue)
		{
			try
			{
				DataSet ds = new   DataSet();
				sqlstr =" Select index , sharestanName From List  Where ostanIndex ="+combovalue;
				SqlDataAdapter da =new SqlDataAdapter(sqlstr, conectionString);
				da.Fill(ds ,"responseDataset" );//responseDataset نام جدول جواب است
				da.Dispose ();
			  	return ds.GetXml() ;
			}
			catch
			{
				return null ;
			}
		}



3- حالا به مرحله خوبش رسیدیم

  مرحله سوم این است که کاربر با همان کدهای جاوایی و با تکنولوژی آجاکس داده هارا بگیرد و در کمبوی دوم یعنی شهرستان نمایش دهد
این کار را تابع 
ResponseShow()
انجام می دهد 
در دو مرحله اول گرفتن داده ها از 
Msxml2.XMLHTTP
یا
Microsoft.XMLHTTP
بعد لود کردن آن در کومبوی دوم
LoadData()

داده شما پر شده تکنولوژی آجاکس دراختیار شماست
التماس دعا -بیایید برای ظهور دعا کنیم.

راستی این هم کدهای جاوایی اش که آن را در یک فایل به نام 
TestAjax.js
می ریزیدو
 با این تگ به صفحه اصلی تون لینک می کنید و برای کاربر می فرستید.

	<script language="javascript" src="TestAjax.js"></script>






//******	AjaxScript.js **************//
var responsePageName = 'ResponsePage.aspx' ;//set response page for ajax (SET BY AJAX PROGRAMER )
	
var objfirstcombo;  //Set Global Vaiable firstcombo for use in ProcessResponse() for clean last combo data and load new comboData 
var objsecondcombo; //Set Global Vaiable secondcombo for use in ProcessResponse() for clean last combo data and load new comboData 

// <summary>
// GetDataViaAjax :(MAIN Proccess Send Request)
// Send a request to server by ActiveXObject 
// this response must back from  responsePageName in Same http location 

function GetDataViaAJAX(firstcombo,secondcombo)
{
	//set combo global objects
	objfirstcombo   = firstcombo;
	objsecondcombo  = secondcombo;
											// set query string for send to server which recognized which combo data 
											// must back from server in XML format.
	var queryString = secondcombo.id+"=" + firstcombo.value; 
	var obj         = SetActiveXobject();     // Set activeX object what Ajax Work by it !
	if (obj !=null)
	{
		obj.onreadystatechange = ResponseShow;//set response function in Java
		
		var responseURL = SetUrl( responsePageName  , queryString) ;//Set Response URL
		
		obj.open("GET", responseURL,  true); //get xml response from  responseURL of server
		
		obj.send(null);
	}//obj
	return false;
}

// <summary>
//	ProcessResponse:(MAIN Proccess Received Data)
// get xml data Backed from server
// if data is backed , load it to the combo

function ResponseShow()
{
	var xmlData = GetReceivedData() ;
	if (xmlData  != null )
	{
			LoadData ( xmlData );
	}
}//end processResponse

// <summary>
// SetActiveXobjext : ( called in GetDataViaAJAX)
// Set ActiveXObject Msxml2.XMLHTTP Or Microsoft.XMLHTTP
// This object is Kernel Of Ajax for get xml data from server

function SetActiveXobject()
{
	try
	{
		obj = new ActiveXObject("Msxml2.XMLHTTP");
	}
	catch(e)
	{
		try
		{
			obj = new ActiveXObject("Microsoft.XMLHTTP");
		}
		catch(e1)
		{
			obj = null;
		}
	}
	//alert (obj);
	return obj ;
}

// <summary>
//	SetUrl : (called in GetDataViaAJAX)
//  Set entier Response URL By Adding Three Parts:
//  1 - Current URL Whithout This page 
//  2 - Response Page Name
//  3 - QueryString
	
function SetUrl(responsePageName ,strQueryString ) 
	{
	
	var pos    = 0; 
    var sumpos = 0;
    currURL = (document.location.href).toLowerCase();//href or pathname is ok
													//alert(currURL);
	var endstr = currURL;
    while (pos >= 0)
    {
		
    	pos = endstr.indexOf('/', 0 );
    	endstr = endstr.substring(pos +1 ,endstr.length);//endstr.length - pos -1 );
    	sumpos =sumpos + pos +1;
    }
	
    var pathWithoutPage = currURL.substring(0 ,sumpos );// Get CurrentURL Without Current Page Name 
    var ResURL   = pathWithoutPage + responsePageName +"?" +strQueryString ;// Add Three parts ;
														//DEBUG:
														//alert( vurl);
	return ResURL;
}//SetUrl


// <summary>
// GetReceivedData: (called in ProcessResponse)
//  if xml file is loaded completely
//    and  if everything is ok
//    return xml data

function GetReceivedData()
{
		var dsXml  = null ;
		if (obj.readyState == 4)/*Only process if xml file is loaded completely:4="Complete" */
		{
			if (obj.status == 200) /*Only process if everything is ok*/
			{
				dsXml =obj.responseXML.documentElement; 
			}//status =200
			else
			{
				alert("Error retrieving data!" );
			}
		
		}//readyState == 4
		return dsXml  ;
}

// <summary>
// LoadData :(called in ProcessResponse)
// load xml data backed from server
// to second combo 

function LoadData(xmlData)
{
		ClearCombo(objsecondcombo);//Empty secondcombo options
		
		var itemindexColumn = xmlData.getElementsByTagName('itemindex');//Get itemIndexColumn
		var itemColumn = xmlData.getElementsByTagName('item');		  // Get item Column	
		var combovalue; 
		var comboText; 
		var listItem;            //combo list item
		for (var count = 0; count < itemindexColumn.length; count++)//for all rows in index column
		{
   				combovalue = (itemindexColumn[count].textContent || itemindexColumn[count].innerText || itemindexColumn[count].text);
   				comboText = (itemColumn[count].textContent || itemColumn[count].innerText || itemColumn[count].text);
   				listItem = new Option(comboText, combovalue,  false, false);//New combo option
				objsecondcombo.options[objsecondcombo.length] = listItem;  //Add combo option
		}


}//Load Data

function ClearCombo (combo)
{
	for (var count = combo.options.length-1; count >-1; count--)
	{
			combo.options[count] = null;
	}
	

}//ClearCombo

----------


## mojehfilm

امروز تو سایت ajax مایکروسافت بودم ! 
نسخه 1 کتابخانه ajax مایروسافت آماده شد .  :متعجب:

----------


## Behrouz_Rad

1 هفته پیش Release شد!

----------


## problem

بدون شک نوشتار هر دوی شما دوستان کامل‌تر بود اگر لینکی هم به این کتابخانه می‌گذاشتید تا دیگران استفاده ببرند. به همین خاطر، من به نیابت از شما *این لینک* رو قرار می‌دم تا کسانی که مایل هستن بتونن ب سایت AJAX مایکروسافت سری بزنند.

----------


## Nasa_Star

دوست عزیز با تشکر از شما به خاطر این مطالب باید عرض کنم که Ajax  *تکنولوژی* نیست بلکه یک *تکنیک* است که شامل مجموعه ای از  تکنولوژی ها می باشد . 

http://en.wikipedia.org/wiki/AJAX

----------


## ali_ali_ali

سلام 
من یک تازه وارد هستم ولی تا حدودی با ajax آشنا هستم و با بعضی از نرم افزار های atlas کار میکنم که سایت اونا را می گذارم در ضمن تو این سایت clipeها آموزشی با حالی وجود دارد که اگر اینترنت پر سرعت دارید پیشنهاد میکنم download کنید
فعلا تا بعد
http://ajax.asp.net/Default.aspx

----------


## ramin2nt2

سلام دوستان

من در استفاده از شی XMLHttp مشکل دارم

همون طور که می دونید برای ساختن این شی در مرورگر های Mozilla از دستور
مثلا var Req=new XMLHttpRequest()
و در مرورگر IE از دستورات 
var req=false;0
try
}
 req=new ActiveXObject("Microsoft.XMLHTTP");0
}
catch(e)0
}
try
}
req=new ActiveXObject("Msxml2.XMLHTTP")0
{
catch(e2)0
}
req=false;0
{
{

استفاده می کنیم 
وقتی که req.readyState==4 شد ، شی قابل استفاده هستش
ولی شی req ، برای من همیشه مقدار 0 رو برمیگردونه

چه کار کنم ؟؟؟

----------


## problem

من گمان می‌کنم که شما باید کد رو توی یک while بگذاری که این‌قدر دور می‌زنه تا ببینه که req مقدارش شده 4 اون وقت بقیه کد رو اجرا می‌کنه.

----------


## رها

سلام.
من یه تحقیق مختصر راجع به اصول تکنیک آژاکس کردم که نتیجه اش رو در این تاپیک قرار دادم.
https://barnamenevis.org/showthread.php?t=74695
این هم لینک مستقیم دانلودش
http://www.jaber.joolo.com/foundatio...%20ajax-fa.rar
موفق باشید

----------


## sweb

مطالب جالبی بود ولی خب این تاپیک که من دیدم همش در انحصار دات نت کار ها بود. چیزی از فریم ورک ها و تکنیک های آژاکس در PHP ندیدم.

بهتره یک تحقیق کوچولو در مورد سرعت و فراگیری PHP بکنید من از انتخابش راضیم. حالا اگه PHP 6 بیاد جالب تر هم میشه

لطفاً در مورد ارسال یک مقدار به سرور توضیح بدین و در مورد 2 تا از توابع OPEN و SEND ابجکت AJAX !

در ضمن اگه جایی رو میشناسین که Tutorial های ساده و حرفه ای داره معرفی کنین.

متشکرم.

----------


## Folaani

بابا اجاکس زیادی چیز پیچیده ای نیست؛ اینقدر هم دنگ و فنگ نداره.
فقط جایی که لازمه ازش استفاده کنید؛ افراط و اهداف صرفا نمایشی باعث مبتذل شدن کار میشه.
منکه توی پروژهء کوچیک خودم بطور مثال، فقط برای اینکه کاربر موقعی که فرم رجیستر رو پر میکنه بفهمه که نام کاربری انتخابیش قبلا رجیستر شده یا نه، از اجاکس استفاده کردم.
در پی اچ پی دستی کد بنویسید. خیلی راحته.
فریم ورک هم چنتایی هست که معروفترینش فکر میکنم prototype هست. من گرفتمش نگاهی بهش کردم ولی ازش استفاده ای نکردم؛ چون کلی چیز اضافه داشت که باید ازش برمیداشتم و مربوط به اجاکس نبودن. دستی نوشتم سریع و کم حجم.
ضمنا اجاکس فقط مثل یک صفحهء پنهان هست که در درون صفحهء شما اجرا میشه و میتونید محتویات این صفحه رو بخونید (البته به این مزیت که اغلب، اطلاعات رد و بدل شده در استفاده های اجاکسی بسیار کمتر از یک صفحهء معمولی هست هم توجه کنید). بطور مثال قبلا بیشتر از فریمهای داخلی پنهان بجای XHR استفاده میشده.
XHR ابتکار میکروسافت بود که بعدا در مرورگرهای دیگه هم معادل سازی شد. در کنسرسیوم وب هم رسمی شده و استاندارد داره.

----------


## Folaani

اینهم منابعی چند:

مربوط به Dynamic script loading:
http://www.webreference.com/programming/ajax_tech/
http://www.webreference.com/programm...ax_tech/2.html
فکر میکنم این  تاریخچه ای باشه.

مواظب اون دو صفحهء اول باشید؛ گویا جاوااسکریپت صفحه اشکال داره و ممکنه مرورگرتون هنگ کنه! اگر به مشکل خوردید جاوااسکریپت رو میتونید موقتا غیرفعال کنید.

----------------------------------------
آموزش اصول اجاکس:
http://developer.mozilla.org/en/docs...etting_Started
http://www.xul.fr/en-xml-ajax.html
http://www.xul.fr/XMLHttpRequest-object.html

---------------------------------------
نقطهء شروع اولیه و سرنخها (برای تعاریف و آشنایی کلی و تاریخچه و غیره هم لازمه - درواقع اولین منبع مورد مطالعه که آخر آوردم):
http://en.wikipedia.org/wiki/AJAX
این هم مهمه:
http://en.wikipedia.org/wiki/XMLHttpRequest

---------------------------------------
و غیره!! (بعضی سرنخهایی رو که در مقالات ویکی اومده دنبال کنید - بنده هنوز اونها رو مطالعه نکردم بدونم بقدر کافی مناسب هستن یا نه)

مسایل جانبی درگیر مثل آشنایی کافی و طرز استفاده از XML و JSON و غیره هم که خودشون جدا. بنده اونهایی رو که مستقیما به اجاکس مربوط میشد و قدم اوله لیست کردم.
ضمنا درمورد Iframe هم اگر خواستید به مقالهء ویکی مراجعه کنید و همچنین W3C.

=============

اینهم یک مرجع دقیقتر برای درک عمیق و تخصصی XMLHttpRequest Object:
http://www.w3.org/TR/XMLHttpRequest/

این یکی هم بازهم مقالهء آموزشی خوبی هست:
http://www.xml.com/pub/a/2005/02/09/...p-request.html
دقت کنید زیرش کامنت هست که حجمش بنظر خیلی زیاد میاد در وهلهء اول؛ اما مقالهء اصلی قابل صرف وقت هست.

=======

نکته: اینها محتوی دو پست متوالی بوده که در فروم دیگری زده بودم. کپی و پیست کردم اینجا.

----------


## oxygenws

> XHR ابتکار میکروسافت بود که بعدا در مرورگرهای دیگه هم معادل سازی شد. در کنسرسیوم وب هم رسمی شده و استاندارد داره.


ممنون به خاطر مطلب کاملتون.
البته فکر کنم، هنوز به صورت پیش نویس هست و مورد تایید W3C نباشه.

----------


## Folaani

بله حق با شماست. بنده W3C Working Draft 18 June 2007 رو خوندم.
توضیح وضعیتش در خود سند اومده؛ اما بنده باید دقت بیشتری میکردم که توجه و حضور ذهن کافی نسبت به این باریک بینی نداشتم متاسفانه.
درواقع بیشتر منظورم این بود که بالاخره وارد کنسرسیوم وب شده و استانداردهای هرچند غیرنهایی براش وجود داره؛ نه مثل تکنولوژیهای انحصاری میکروسافت که جزو استانداردهای جهانی و مالتی پلتفرم نباشه.
فرضا یک چیزی مثل ECMA Script. میکروسافت JScript رو داره و موزیلا JavaScript رو؛ ولی وقتی استاندارد رسمی جهانی براش باشه مشکلات به حداقل کاهش پیدا میکنه و مرورگرهای دیگه و شرکتهای دیگه هم از اون استاندارد پیروی میکنن.
مسلما ممکنه تغییرات زیادی بکنه (ممکن هم هست تنها خیلی چیزها بهش اضافه بشه) و فعلا به مراحل نهایی نرسیده و کاملا رسمی نیست. اما بهرحال در اینکه این متد جزیی از استانداردهای رسمی آینده هست تقریبا شکی نیست.

----------


## mostafa_shaeri_tj

چرا وقتی درخواست تکراری از طریق ajax به سرور(دیتابیس) میدم ,با اینکه محتویات دیتا بیس تغییر کرده باز هم جوابی مانند جواب درخواست قبلی به من میده.
نمیدونم تونستم خوب مشکلم و بگم یا نه ولی اگه چیزی میدونین لطف کنین...

----------


## Behrouz_Rad

اگر از هسته ی اصلی AJAX استفاده می کنی باید یک مقدار راندوم (مثلا زمان جاری) رو با استفاده از کلاس date در جاوا اسکریپت ایجاد و به انتهای URL ارسالی الصاق کنید.
درخواست های شما بنا به ذات آجاکس Cache میشن که با این روش جلوی Cache شدن اونها رو می گیری.

موفق باشید.

----------


## noosh_flo

سلام با تشكر از مطالب خوبتون
كسي تا به حال سايتي را پياده سازي كرده كه با ajax كار كند و دكمه هاي backward و forward مرورگرش (explorer) هم به درستي كار كند ؟ اگر كدهاي مربوط را داشته باشيد هم كه چه بهتر. :چشمک:

----------


## m.labbaf

فکر کنم منظورتون این باشه .
javascript**:history.back()
این کد کار backward رو میکنه.

----------


## noosh_flo

سلام
كدي كه در بالا اورده شده در حالت Ajax ي كار نمي كند. اگر شما وقتي در Gmail مشغول چك كردن Inbox باشيد و در اين حالت دكمه Back مرورگر را فشار بديد كلا از mail خودتان خارج مي شويد.همه اينها به اين خاطر است كه وقتي از Ajax استفاده مي كنيد URL صفحه تغييري نمي كند.
مطلبي كه نوشتم خيلي خلاصه است و متاسفانه فرصت ندارم قضيه را كامل باز كنم چون هنوز راه حلي براي سئوالي كه پرسيدم پيدا نكردم ولي چند تا لينك اينجا مي گذارم هر كسي كه علاقه مند است مي تواند يه سري بزند. به هر حال اگر داريد از Ajax استفاده مي كنيد دير يا زود با مشكل من مواجه خواهيد شد.

www.*ajaxonomy*.com/2007/web-design/a-*better*-*ajax*-*back*-*button*-*solution*

www.robertpenner.com/experiments/backbutton/flashpage.html

http://www.ibm.com/developerworks/library/os-php-rad1/

خوش باشيد

----------


## fiendish66

چطوری از ای جکس استفاده کنیم که google همه قسمت هایی که با ای جکس فراخوانی میشه رو بشناسه و در جستجو ها بیاد.
من یه سایت نوشتم که کلا با ای جکسه ولی وقتی در google سرچ می کنم فقط صفحه ایندکس رو میده.
نشانی : http://aj.irhelp.com
ممنون میشم کمکم کنید.
در ضمن من اصلا از xml استفاده نکردم.

----------


## worya63

> مایکروسافت هم برای استفاده از Ajax در حال کار بر روی پروژه ای به نام Atlas  است که فکر کنم به زودی آماده پیش نمایش شود. خالاصه اینکه تصور من این است Ajax به تدریج فراگیر تر بشه و سهم بیشتری از وب رو در اختیار بگیره. 
> 
> راستی ئر مورد معایب Ajax هم اگه کسی چیزی میدونه بگه من هم یه چیزایی میدونم مثل اینکه با Back And Forward مشکل داره و در حقیقت اونا را از بین میبره و اینکه به XmlHttpRequest به شدت نیازمنده در صورتی که از نظر امنیتی بسیار ضعیف است ....
> رفقا شما هم یه چیزی بگید


سلام.دوست گرامی از مطالب پربار و عالی شما واقعا استفده کردم.در صورتی که مقدور باشد برای استارت یه پروژه دانشجویی از شما کمک بگیرم.

----------


## azam attar

لینک دانلود خرابه لطفا یکی درستش کنه احتیاج دارم :افسرده:

----------


## raha1986

> راستی ئر مورد معایب Ajax هم اگه کسی چیزی میدونه بگه من هم یه چیزایی میدونم مثل اینکه با Back And Forward مشکل داره و در حقیقت اونا را از بین میبره و اینکه به XmlHttpRequest به شدت نیازمنده در صورتی که از نظر امنیتی بسیار ضعیف است ....
> رفقا شما هم یه چیزی بگید


سلام
دوست عزیز با توجه به اینکه مدتی از این پست شما میگذره آیا جوابی برای این سوالتون پیدا کردین؟

----------

