loading...
 

شاپ کیپر

شاپ کیپر

در کد نویسی سنتی جاوا اسکریپت, در صورتی که قصد داشته باشد از دیتابیس و یا فایلی بر روی سرور اطلاعات بگیرید, و یا ارسال اطلاعات کاربر به سرور, شما می بایست برای ارسال اطلاعات به دو روش get و post فرم طراحی می نمودید. و کاربر مجبور بود بر روی کلید ارسال کلیک نماید تا اطلاعات ارسال گردد, و منتظر پاسخ سرور باقی می ماند, و سپس صفحه جدید با نتایج لود می شود.
زیرا زمانی که کاربر بر روی کلید ارسال کلیک می نماید صفحه جدید باز می شود, طراحی سایت سنتی مدت زمان بیشتری را از کاربر می گرفت و مورد پسند کاربران نیز نبود. توسط ajax سایت توسط javascript به صورت مستقیم با سرور در ارتباط می باشد, که این کار از طریق آبجکت JavaScript XMLHttpRequest انجام می شود.
با یک درخواست HTTP, صفحه وب سایت می تواند درخواست خود را ارسال نماید, و سپس از وب سرور پاسخ بگیرد, بدون نیاز به بارگذاری مجدد صفحه. کاربر در همان صفحه اول باقی می ماند, و کاربر متوجه این موضوع نخواهد گردید که در پس زمینه برنامه در حال انجام است.
تصویر زیر نحوه عملکرد Ajax را نمایش می دهد:

کاربر درخواستی را انجام می دهد و در پس زمینه فرآیندها انجام می شود و سپس در لایه ای به درخواست کاربر پاسخ داده می شود, که محعمولا توسط ID شناخته می شود, بدون لود کامل صفحه. به عنوان مثال یک لایه با این آی دی:
<div id=”ajaxResponse”></div>در مرحله بعدی ما می بینیم که چطور یک درخواست XMLHttpRequest ارسال می شود و پاسخ گرفته می شود.

1. ساخت XMLhttpRequest

مرورگرهای مختلف روش های متفاوتی برای ساخت XMLHttpRequest دارند. اینترنت اکسپلورر از ActiveXObject استفاده می نماید, در صورتی که سایر مرورگرها از XMLHttpRequest که تابع داخلی جاوا اسکریپت می باشد استفاده می نمایند.
برای آنکه این آبجکت ساخته شود و با مرورگرهای مختلف سازگاری کامل داشته باشد می بایست از “try and catch” استفاده نمایید.
()function ajaxFunction
}
;var xmlHttp
try
}
Firefox, Opera 8.0+, Safari//
;()xmlHttp=new XMLHttpRequest
}
(catch (e
}
Internet Explorer//
try
}
;("xmlHttp=new ActiveXObject(“Msxml2.XMLHTTP
{
(catch (e
}
try
;("xmlHttp=new ActiveXObject(“Microsoft.XMLHTTP
{
(catch (e
}
;("!alert(“Your browser does not support AJAX
;return false
{
{
{
لینک منبع
درباره AJAX ,
زینب بازدید : 8 سه شنبه 27 خرداد 1399 زمان : ۱۸:۰۵ نظرات (0)
ممکن است شما در طراحی وب سایت خود در نظر دارید این امکان را برای کاربران وب سایت خود فراهم آورید که با تایپ یک حرف از کلمه در باکس خاص، خود کلمه را برای کاربر به نمایش بگذارید. برای مثال با تایپ حرف "ط" در باکس، کلمه طراحی سایت برای کاربر پیشنهاد شود. ما در اینجا به شرح انجام این فرایند می پردازیم.





function showHint(str)
{
if (str.length==0)
{
document.getElementById("txtHint").innerHTML="";
return;
}
var xmlhttp=new XMLHttpRequest();
xmlhttp.on-readystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlht tp.responseText;
}
}
xmlhttp.open("GET","gethint.asp?q="+str,true);
xmlhttp.send();
}





اگر باکس خالی نباشد در اینصورت تابع showHint() اجرا خواهد شد. پس از اجرا تابع فای PHPاجرا خواهد شد. در زیر مثالی از فایل PHPنوشته شده را به نمایش گذاشته ایم.





<?php
// Fill up array with names
$a[]="Anna";
$a[]="Brittany";
$a[]="Cinderella";
$a[]="Diana";
$a[]="Eva";
$a[]="Fiona";
$a[]="Gunda";
$a[]="Hege";
$a[]="Inga";
$a[]="Johanna";
$a[]="Kitty";
$a[]="Linda";
$a[]="Nina";
$a[]="Ophelia";
$a[]="Petunia";
$a[]="Amanda";
$a[]="Raquel";
$a[]="Cindy";
$a[]="Doris";
$a[]="Eve";
$a[]="Evita";
$a[]="Sunniva";
$a[]="Tove";
$a[]="Unni";
$a[]="Violet";
$a[]="Liza";
$a[]="Elizabeth";
$a[]="Ellen";
$a[]="Wenche";
$a[]="Vicky";


// get the q parameter from URL
$q=$_REQUEST["q"]; $hint="";


// lookup all hints from array if $q is different from ""
if ($q !== "")
{ $q=strtolower($q); $len=strlen($q);
foreach($a as $name)
{ if (stristr($q, substr($name,0,$len)))
{ if ($hint==="")
{ $hint=$name; }
else
{ $hint .= ", $name"; }
}
}
}


// Output "no suggestion" if no hint were found
// or output the correct values
echo $hint==="" ? "no suggestion" : $hint;
?>





به آسانی با قابلیت های کدهای AJAX می توانید علاوه بر سهولت کاربران وب سایت خود، موجب جلب نظر آنها شوید که این عمل ترافیک را به سمت سایت شما به دنبال خواهد داشت و به طبع آن تاثیر مثبت در سئو وب سایت خود را شاهد خواهید بود.




منبع: استفاده از AJAX در پیشنهاد کلمه در طراحی سایت
درباره AJAX ,
زینب بازدید : 8 جمعه 19 ارديبهشت 1399 زمان : ۲۰:۵۰ نظرات (0)
این مقاله، یک برنامه نمونه (sample application) ایجاد می کند که از ویژگی های AJAX ASP.NET استفاده می کند.
شما در این مقاله، برنامه ای خواهید ساخت که صفحات اطلاعات کارمندان را از بانک اطلاعاتی نمونه AdventureWorks نمایش می دهد. این برنامه از کنترل UpdatePanel برای ریفرش کردن تنها بخشی از صفحه که تغییر پیدا کرده است، استفاده می کند؛ بدون اینکه page flashیی که با post back اتفاق می اقتد.این کار، "آپدیت جزیی صفحه" (partial-page update) نامیده می شود. همچنین برنامه نمونه از کنترل UpdateProgress، جهت نمایش پیام وضعیت، هنگامی که آپدیت جزیی صفحه در حال اجرا است، استفاده می کند.

پیش نیازها

شما برای پیاده سازی این مقاله، به موارد زیر احتیاج دارید:

Microsoft Visual Studio 2005 یا Microsoft Visual Web Developer Express.

یک وب سایت ASP.NET با قابلیت AJAX

بانک اطلاعاتی نمونه AdventureWorks.
ایجاد وب سایت ASP.NET

وب سایتی که بطور پیش فرض در ASP.NET ایجاد می کنید، قابلیت Microsoft Ajax را ساپورت می کند.
ایجاد یک وب سایت ASP.NET با قابلیت AJAX

Visual Studio را باز کنید.در منوی File، روی New Web Site کلیک کنید. ( پنجره New Web Site ظاهر می شود.)زیر Visual Studio installed templates، گزینه ASP.NET Web Site را انتخاب کنید.مکان (location) و زبان را وارد کنید و سپس OK کنید.

اضافه کردن کنترل UpdatePanel به صفحه وب ASP.NET

بعد از اینکه یک وب سایت ASP.NET ایجاد کردید، باید یک صفحه وب ایجاد کنید که حاوی کنترل UpdatePanel باشد. قبل از اینکه کنترل UpdatePanel را به صفحه اضافه کنید، باید یک کنترل ScriptManager اضافه کنید. کنترل UpdatePanel، وابسته به کنترل ScriptManager، جهت مدیریت کردن آپدیت جزیی صفحه، است.
ایجاد یک صفحه وب ASP.NET
1. در Solution Explorer، روی نام سایت کلیک راست و سپس روی Add New Item کلیک کنید.
پنجره Add New Item ظاهر می شود.
2. زیر Visual Studio installed templates، گزینه Web Form را انتخاب کنید.
3. صفحه جدید Employees.aspx را نامگذاری کنید و تیک گزینه Place code in separate file را بردارید.
4. زبانی را که می خواهید استفاده کنید، انتخاب کنید.
5. روی Add کلیک کنید.
6. به ویووی Design سوییچ کنید.
7. در تب AJAX Extensions در toolbox، روی کنترل ScriptManager دابل کلیک کنید تا آن را به صفحه اضافه کنید.

8. یک کنترل UpdatePanel از toolbox درگ کنید و و زیر کنترل ScriptManager دراپ کنید.


اضافه کردن محتوا (content) به کنترل UpdatePanel

کنترل UpdatePanel، آپدیت جزیی صفحه را اجرا می کند و محتوایی را که باید بطور مجزا از بقیه صفحه آپدیت شود، تعیین می کند. در این بخش ار مقاله، باید یک کنترل محدود به داده ها (data-bound) اضافه کنید که داده های بانک اطلاعاتی AdventureWorks را نمایش می دهد.
1. در تب Data در toolbox، یک کنترل GridView به ناحیه قابل ویرایش کنترل UpdatePanel درگ کنید.
2. در منوی GridView Tasks، روی Auto Format کلیک کنید.
3. در پنل Auto Format، زیر Select a scheme، گزینه Colorful را انتخاب و سپس OK کنید.
4. در منوی GridView Tasks، گزینه <New data source> را از لیست Choose Data Source انتخاب کنید.
ویزارد Data Source Configuration ظاهر می شود.
5. زیر Where will the application get data from، گزینه Database را انتخاب و سپس OK کنید.
6. برای مرحله Choose Your Data Connection، در ویزارد Configure Data Source، یک کانکشن به بانک اطلاعاتی AdventureWorks ایجاد کنید و سپس روی کلیک کنید.
7. در مرحله Configure the Select Statement، گزینه Specify a custom SQL statement or stored procedure را انتخاب و سپس روی Next کلیک کنید.
8. در مرحله Define Custom Statement or Stored Procedures، در تب SELECT، عبارت SQL زیر را وارد کنید:

SELECT FirstName, LastName FROM HumanResources.vEmployee ORDER BY LastName, FirstName

9. روی Next کلیک کنید.
10. روی Finish کلیک کنید.
11. در منوی GridView Tasks، چک باکس Enable paging را فعال کنید.
12. تغییرات را ذخیره کنید، و CTRL+F5 را فشار دهید تا صفحه را در مرورگر مشاهده کنید.
توجه داشته باشید هنگام انتخاب صفحه های داده ها، هیچ page flashیی وجود ندارد. به این دلیل که صفحه مورد نظر هیچ postbsck یا هربار آپدیت کردن کل صفحه را اجرا نمی کند.

اضافه کردن کنترل UpdateProgress به صفحه

1. کنترل UpdateProgress، هنگام request محتوای جدید کنترل UpdatePanel،یک پیام وضعیت (status message)، نشان می دهد.
2. یک کنترل UpdateProgress از تب AJAX Extensions درtoolbox، روی صفحه درگ کنید و آن را زیر کنترل UpdatePanel دراپ کنید.
3. کنترل UpdateProgress را انتخاب کنید، و در پنجره Properties، پراپرتی AssociatedUpdatePanelID را روی UpdatePanel1 تنظیم کنید.
این کار، کنترل UpdateProgress را به کنترل UpdatePanel، که قبلاً اضافه کرده اید، مرتبط می کند.
4. در ناحیه قابل ویرایش کنترل UpdateProgress،عبارت Getting Employees ... را تایپ کنید.
5. تغییرات را ذخیره کنید، و CTRL+F5 را فشار دهید تا صفحه را در مرورگر مشاهده کنید.
اگر هنگامی که صفحه، SQL query را اجرا می کند و داده ها را باز می گرداند تاخیری وجود داشته باشد، کنترل UpdateProgress، پیامی را نمایش می دهد که در کنترل UpdateProgress وارد کرده اید.
اضافه کردن Delay به Sample Application
اگر برنامه شما هر صفحه داده را سریعاً آپدیت می کند، شاید محتوای کنترل UpdateProgress را روی صفحه نبینید. این کنترل، پراپرتی DisplayAfter را، که شما را قادر می کند یک تاخیر (delay) قبل از نمایش کنترل قرار دهید، ساپورت می کند. این کار، اگر آپدیت خیلی سریع اتفاق بیافتد، کنترل را از flashing در مرورگر باز می دارد. این تاخیر بطور پیش فرض، روی 500 میلی ثانیه (نصف ثانیه) تنظیم است، بدین معنی که اگر آپدیت کمتر از نیم ثانیه طول بکشد، کنترل UpdateProgress نمایش داده نخواهد شد.
در محیط development، می توانید یک تاخیر مصنوعی به برنامه تان اضافه کنید تا مطمئن شوید که کنترل UpdateProgress همانطور که انتظار می رفت عمل می کند. این کار اختیاری است و فقط برای تست کردن برنامه تان است.
1. درون کنترل UpdatePanel، کنترل GridView را انتخاب کنید.
2. در پنجره Properties، روی دکمه Events کلیک کنید.
3. روی ایونت PageIndexChanged دابل کلیک کنید تا یک event handler ایجاد کنید.
4. کد زیر را به ایونت هندلر PageIndexChanged اضافه کنید تا یک تاخیر سه ثانیه ای ایجاد کنید.
در VB:

Include three second delay for example only.
System.Threading.Thread.Sleep(3000)



در C#:

//Include three second delay for example only.
System.Threading.Thread.Sleep(3000);



5. تغییرات را ذخیره کنید، و CTRL+F5 را فشار دهید تا صفحه را در مرورگر مشاهده کنید.
از آنجاییکه حالا هر دفعه که به صفحه جدیدی از داده ها می رویم یک تاخیر سه ثانیه ای داریم، می توانید کنترل UpdateProgress را ببینید.
در VB:

<%@ Page Language="VB" %>

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

<script runat="server">

Protected Sub GridView1_PageIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs)
Include three second delay for example only.
System.Threading.Thread.Sleep(3000)
End Sub
</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>

</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:GridView ID="GridView1" runat="server" AllowPaging="True" CellPadding="4" DataSourceID="SqlDataSource1"
ForeColor="#333333" GridLines="None" OnPageIndexChanged="GridView1_PageIndexChanged">
<FooterStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
<RowStyle BackColor="#FFFBD6" ForeColor="#333333" />
<SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="Navy" />
<PagerStyle BackColor="#FFCC66" ForeColor="#333333" HorizontalAlign="Center" />
<HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
<AlternatingRowStyle BackColor="White" />
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:AdventureWorksConnectionString %>"
SelectCommand="SELECT FirstName, LastName FROM HumanResources.vEmployee ORDER BY LastName, FirstName">
</asp:SqlDataSource>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress1" runat="server">
<ProgressTemplate>
Getting employees...
</ProgressTemplate>
</asp:UpdateProgress>
</form>
</body>
</html>



در C#:

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

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

<script runat="server">

protected void GridView1_PageIndexChanged(object sender, EventArgs e)
{
//Include three second delay for example only.
System.Threading.Thread.Sleep(3000);
}
</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>

</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:GridView ID="GridView1" runat="server" AllowPaging="True" CellPadding="4" DataSourceID="SqlDataSource1"
ForeColor="#333333" GridLines="None" OnPageIndexChanged="GridView1_PageIndexChanged">
<FooterStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
<RowStyle BackColor="#FFFBD6" ForeColor="#333333" />
<SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="Navy" />
<PagerStyle BackColor="#FFCC66" ForeColor="#333333" HorizontalAlign="Center" />
<HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
<AlternatingRowStyle BackColor="White" />
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:AdventureWorksConnectionString %>"
SelectCommand="SELECT FirstName, LastName FROM HumanResources.vEmployee ORDER BY LastName, FirstName">
</asp:SqlDataSource>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress1" runat="server">
<ProgressTemplate>
Getting employees...
</ProgressTemplate>
</asp:UpdateProgress>
</form>
</body>
</html>
درباره AJAX ,
زینب بازدید : 11 پنجشنبه 28 فروردين 1399 زمان : ۰۲:۴۵ نظرات (0)
همه چیز درباره Ajax‌
واژه Ajax سرنام عبارت Asynchronous JavaScript and XML و به معنی <جاوا اسکریپت و XML آسنکرون یا نامتقارن> است. ای‌جکس فناوری جدیدی است که به کمک آن می‌توان اینترفیس یک برنامه تحت وب را طوری ساخت که وقتی کاربر روی دکمه یا لینکی کلیک می‌کند، کلیه عملیات ارسال اطلاعات و دریافت نتایج در پشت صحنه انجام ‌شود و فقط آن قسمت از اینترفیس که قرار است اطلاعات جدید را به نمایش درآورد تغییر ‌کند بدون اینکه تمام صفحه از نو بارگذاری شود. در این مقاله می‌خواهیم این فناوری نوین و تحول آفرین را از جنبه‌های مختلف مورد بررسی قرار دهیم و با مبانی فنی آن آشنا شویم.


کمربندها را ببندید

آیا از دنیای کلاسیک وب خسته شده‌اید؟ آیا مایلید با چهره جدید وب آشنا شوید؟ آیا می‌خواهید با جدیدترین فناوری دنیای برنامه‌نویسی وب آشنا شوید؟ برای پرواز آماده باشید! مقصد ما یکی از استان‌های کشور جدید التاسیس Web 2.0 است. می‌خواهیم با هم به دنیای هیجان انگیز Ajax سفر کنیم.در سرزمین ای‌جکس چهره سایت‌های وب مانند نرم‌افزارهای رومیزی به نظر می‌رسند. اکنون وب خانه دوم اطلاعات دیجیتالی شما است. حالا که با داشتن یک خط اینترنت پرسرعت می‌توانید در تمام طول شبانه روز به اینترنت متصل باشید، وقت آن فرارسیده که نرم‌افزارهای تحت وب نیز متحول شوند و کارکرد و قابلیتی مانند نرم‌افزارهای رومیزی داشته باشند. به این ترتیب فاصله و تفاوت میان نرم‌افزارهای دسکتاپ و نرم‌افزارهای آنلاین ناپدید می‌شود. دیگر لازم نیست وقتی روی دکمه submit کلیک می‌کنید منتظر بارگذاری مجدد صفحه وب بمانید. همه‌چیز فورا و به سرعت اتفاق می‌‌افتد.تصور کنید به صورت آنلاین در حال خواندن نامه‌های الکترونیکی خود در یکی از سایت‌های یاهو یا جی‌میل هستید. فورا یادتان می‌افتد که باید به کسی نامه‌ای بفرستید. لازم نیست صفحه‌ای که در حال مطالعه آن هستید را ترک کنید و یا با استفاده از ترفندهایی مانند رایت کلیک و فرمان Open in New window یک پنجره جدید بازکنید و منتظر بارگذاری مجدد صفحه شوید. شما فقط می‌خواهید یک پنجره جدید باز کنید که داخلش نامه خود را تایپ کنید.چه نیازی به بارگذاری مجدد آن‌همه اطلاعات جزئی و جنبی (مانند لوگوی سایت، نام آیدی شما و …) است که در اطراف اطلاعات اصلی به نمایش درآمده‌اند؟ ای‌جکس همین کار را برای شما می‌کند. وقتی که نامه خود را ارسال کردید نیز فقط همان پنجره بسته می‌شود و چند بایت برای سایت مقصد ارسال می‌شود و اینترفیس صندوق پستی نامه‌های شما بدون این‌که تکان بخورد و یا دوباره به نمایش درآید همچنان پیش چشم شما و منتظر فرمان بعدی است. در دنیای ای‌جکس دکمه‌های Back و Forward مرورگر معنی و کاربرد خود را تقریبا از دست می‌دهند.همه دکمه‌های مورد نیاز داخل اینترفیس سایت موجود است. برخلاف جهان Web 1.0، در دنیای ای‌جکس گشت و گذار در وب لزوما خطی نیست. اگر می‌خواهید از یک فروشگاه الکترونیکی خرید کنید، می‌توانید محصول مورد نظرتان را به روش drag&drop داخل سبد بیندازید و با فشردن دکمه نهایی، خرید خود را ثبت کنید. پیغام ثبت موفقیت آمیز سفارش برای شما نمایش داده می‌شود و کار تمام است. لازم نیست از صفحه الف به صفحه ب و سپس از آنجا به صفحه ج بروید.


ای‌جکس چیست؟
این واژه را اولین بار جسی جیمز گرت (Jesse James Garrett)، برنامه‌نویسی از شرکت Adaptive Path در مقاله‌ای با عنوان <ای‌جکس: رهیافت جدیدی در برنامه‌های تحت وب> به‌کار برد. ای‌جکس سرنام عبارت Asynchronous JavaScript and XML و به معنی ترکیب نامتقارن جاوا اسکپریپت و ‌XML است.چرا نامتقارن؟ چون ترکیب این دو فناوری به شما کمک می‌کند قسمتی از یک صفحه وب را بروز کنید بدون اینکه لازم باشد <همزمان یا متقارن> با این عمل، کل آن صفحه از نو بارگذاری شود. این عملیات توسط شیء و فرمانی به نام XMLHttpRequest انجام می‌شود که سال‌ها پیش، هنگام معرفی نسخه ۴ مرورگر اینترنت اکسپلورر وارد این نرم‌افزار شده و به دلیل قابلیت‌های جالبی که دارد، این روزها تمام مرورگرهای معروف و قدرتمند وب مانند فایرفاکس و اپرا از آن پشتیبانی می‌کنند. به کمک این شی‌ء می‌توانید برنامه‌هایی به زبان جاوا اسکریپت بنویسید که در پشت صحنه یک صفحه وب اطلاعاتی را به سرور بفرستند و داده‌هایی را دریافت کنند.ای‌جکس اساسا رهاوردی از دنیای جاوا است و بار دیگر فناوری جاوا و زبان اسکریپت‌نویسی وابسته به آن را در کانون توجه برنامه‌نویسان قرار داده است. اما خبر خوب اینست که چون همه پلتفرم‌های برنامه‌نویسی وب از قبیلPHP ،ASP.NET و JSP از جاوا اسکریپت و ‌XML پشتیبانی می‌کنند، فناوری ای‌جکس در همه این پلاتفرم‌ها پیاده‌سازی شده و حتی جالب است بدانید که تعداد ماژول‌های ای‌جکس نوشته شده برای دات نت و ‌PHP بیشتر از انواع جاوایی آن است.مایکروسافت که سال‌ها پیش از شیء XMLHttpRequest در نرم‌افزار Outlook Web Access استفاده کرد و جزو اولین ترویج‌دهندگان این تکنیک به شمار می‌رود اخیرا نرم‌افزاری به نام Atlas معرفی کرده که مخصوص برنامه‌نویسی مبتنی بر ای‌جکس است. اما چون ای‌جکس بر اساس جاوا کار می‌کند بدیهی است که جنبش اپن سورس و خیل عظیم برنامه‌نویسان جاوا نیز بیکار نمانده‌ و می‌کوشند تا دیر نشده Ajax را به قلب دنیای نرم‌افزارهای آزاد بیاورند و از انحصاری شدن آن جلوگیری کنند تا این فناوری به استاندارد جدید وب تبدیل شود. به نظر می‌رسد که آنها موفق بوده‌اند زیرا حتی پیاده‌سازی‌های دات نتی ای‌جکس نیز اغلب به صورت اپن سورس است.


مکانیزم Ajax
جسی جیمز گرت در مقاله معروف خود شیوه عمل ای‌جکس را چنین توضیح می‌دهد: هر عمل از سوی کاربر که به طور معمول موجب تولید یک تقاضای HTTP شود به جای ارسال مستقیم به وب، موجب فراخوانی یک فرمان جاوا اسکریپتی و هدایت آن به موتور ای‌جکس می‌شود. هر نوع پاسخی به کاربر از سوی سرور (مانند کنترل صحت داده‌های وارد شده در یک فرم ورود اطلاعات، ویرایش اطلاعات در حافظه و حتی برخی از انواع هدایت کاربر در سایت) نیازی به ارسال یک صفحه جدید به سمت کاربر ندارد و تنها همان قسمتی که باید تغییر کند بروز می‌شود.به طور سنتی وقتی کاربر فرمی را پرمی‌کند و به سایت ارسال می‌کند، وب سرور با بارگذاری مجدد یا تازه‌سازی صفحه (refresh) و نمایش یک پیغام و یا نتیجه پردازش اطلاعات، به او پاسخ می‌دهد و به همین دلیل هم وقت سرور برای ارسال کل محتوای آن صفحه گرفته می‌شود و هم کاربر باید برای دریافت کامل آن صفحه منتظر بماند؛ که نتیجه آن کاهش بازده سرور، مصرف پهنای باند و تلف شدن وقت و هزینه است. اما به‌کارگیری تکنیک ای‌جکس این مشکلات را به طرز قابل‌ملاحظه‌ای کاهش می‌دهد.
درباره AJAX ,
زینب بازدید : 14 دوشنبه 28 بهمن 1398 زمان : ۰۰:۱۰ نظرات (0)
در طراحی سایت می توانید با بهره گیری از زبان های مختلف امکانات متفاوت را در صفحه وب سایت فراهم نماییم. با افزودن قابلیت های جدید می توانید بر زیبایی طراحی سایت خود بیفزایید و موجب جلب نظر کاربران سایت خود شوید که در نتیجه آن در سئو سایت خود تاثیر مثبتی را شاهد خواهید بود. زبان Ajax یکی از زبان های پرکاربرد در طراحی سایت می باشد. ممکن است شما در صدد باشید با ایجاد پنل drop downو با بهره گیری از زبان Ajaxقابلیت زیبایی را در طراحی وب سایت خود لحاظ نمایید. با کلیک بر روی پنل می توانید پیغام پنهانی را به کاربران وب سایت خود نمایش دهید. در اینجا قصد داریم کد لازم برای ایجاد این قابلیت در طراحی سایت را به نمایش بگذاریم.<script type="text/j-avascript" src="/demo/jquery-1.2.2.pack.js"></script> <style type="text/css"> #dropdownpanel{ /*Outermost Panel DIV*/position: absolute;width: 100%;left: 0;top: 0;visibility:hidden;} #dropdownpanel .contentdiv{ /*Div containing Ajax content*/background: black;color: white;padding: 10px;} #dropdownpanel .control{ /*Div containing panel button*/border-top: 5px solid black;color: white;font-weight: bold;text-align: center;background: transparent url("panel.gif") center center no-repeat; /*change panel.gif to your own if desired*/padding-bottom: 3px; /* 21px + 3px should equal height of "panel.gif" */height: 21px; /* 21px + 3 px should equal height of "panel.gif" */line-height: 21px; /* 21px + 3px should equal height of "panel.gif" */} </style> <script type="text/j-avascript" src="/demo/jkpanel.js"> /************************************************ Drop Down Panel script- by JavaScript Kit (www.javascriptkit.com)* This notice must stay intact for usage* Visit JavaScript Kit at JavaScript Kit- Your comprehensive JavaScript, DHTML, CSS, and Ajax stop for this script and 100s more********************************************** */ </script> با آسانی با درج کدهای بالا می توانید قابلیت پنل پنهانی را در طراحی سایت خود درج نمایید و با جلب توجه خاص کاربر به طراحی وب سایت خود در سئو وب سایت خود تاثیر مثبتی را برجا گذاشته باشید.




منبع: طراحی سایت و پنل Drop downبا Ajax
درباره AJAX ,
زینب بازدید : 15 شنبه 07 دي 1398 زمان : ۱۹:۰۰ نظرات (0)
1

تعداد صفحات : 1

موضوعات
لینک دوستان
پیوندهی روزانه
  • آرشیو لینک ها
  • صفحات جداگانه
    آمار سیت
  • کل مطالب : 4,034
  • کل نظرات : 0
  • افراد آنلین : 20
  • تعداد اعضا : 0
  • بازدید امروز : 90
  • باردید دیروز : 5,975
  • بازدید هفته : 35,082
  • بازدید ماه : 131,482
  • بازدید سال : 724,324
  • بازدید کلی : 2,109,547