SiamWebCity.com รับสร้างเว็บไซต์ครบวงจร
เลือกภาษา ภาษาอังกฤษ   
หน้าแรก
web
โปรโมทเว็บ
web
รับทำเว็บไซต์
web
สอนทำเว็บ
web
Domain 299บ.
web
ติดต่อเรา
web
 
รับทำเว็บไซต์ครบวงจร รับพัฒนาแอพพลิเคชั่น สำหรับ Facebook iPad iPhone Android รับอบรมการสร้างเว็บไซต์ โปรโมทเว็บไซต์ ดูแลเว็บไซต์ แก้ไขเว็บไซต์ : เริ่มต้นติดต่อที่เรา ที่เหลือเราเป็นผู้จัดการเพื่อท่าน : เราเป็นมากกว่าเครื่องมือที่ช่วยฝ่าวิกฤตเศรษฐกิจ
รายการ
เกี่ยวกับเรา
ทำไมต้องเลือกเรา
ผลงานที่ผ่านมา
เตรียมตัวก่อนทำเว็บ
รับดูแลเว็บไซต์
แอพ Facebook iPhone
โปรแกรมmlm สำเร็จรูป
เช่าโฮสติง
บริการหลังการขาย
เงื่อนไขการรับบริการ
ร่วมงานกับเรา
คำถามที่พบบ่อย
ติดต่อเรา

ฟรีบทความ
คู่มือการใช้งาน  คู่มือการใช้งาน
VDO สอน Dreamweaver  VDO สอน Dreamweaver
Bitcoin บิทคอยน์  Bitcoin บิทคอยน์
PHP MySQL  VDO  เบื้องต้น  PHP MySQL VDO เบื้องต้น
PHP MySQL  เกร็ดความรู้  PHP MySQL เกร็ดความรู้
jQuery  jQuery
HTML5  HTML5
ASP net   MS SQL  ASP net MS SQL
facebook app  facebook app
JSP  JSP
Oracle  Oracle
CSS  CSS
Google  Google
iphone ipad iphone itune ios  iphone ipad iphone itune ios
SEO  SEO
SQL Server  SQL Server
AJAX  AJAX
รดน้ำอัตโนมัติ  สปริงเกอร์  รดน้ำอัตโนมัติ สปริงเกอร์
คอมพิวเตอร์   อินเตอร์เน็ต  คอมพิวเตอร์ อินเตอร์เน็ต
JavaScripts  JavaScripts
cloud computing  cloud computing
xhtml  xhtml
Photoshop  Photoshop
RSS Feed  RSS Feed
wordpress  wordpress
Computer  Computer
MLM ขายตรง ขยายสายงาน  MLM ขายตรง ขยายสายงาน
NUTT's blog  NUTT's blog
ทีวีดิจิตอล DVB T2  ทีวีดิจิตอล DVB T2
Bootstrap CSS  Bootstrap CSS

รับสอน PHP, MySQL, HTML, CSS, Javascripts, FTP, Dreamweaver,PHPMyAdmin, Appserv, WMSEVER, php-Nuke , Joomla, SMF, Oscommerce, Phpbb, Paypal, Adwordsมาเรียนการสร้างเว็บกัน
บริการสอน แนะนำ Adwords , PHP, MySQL, HTML, FTP, SMF, PHPMyAdmin, Dreamweaver, Oscommerce, Photoshop, Flash...

test speed
Display Pagerank
ดูสถิติเว็บไซต์

Asynchronous JavaScript And XML หรือ AJAX



AJAX > Asynchronous JavaScript And XML หรือ AJAX


AJAX เป็นเทคนิควิธีการพัฒนาเว็บแอพพลิคเคชัน ให้มีความสามารถโต้ตอบกับผู้ใช้งานได้ดีขึ้น

ปกติแล้วหน้าเว็บเพจที่มีการเปลี่ยนแปลงข้อมูลอยู่เสมอๆ จะถูกสร้างด้วยโปรแกรมที่ฝั่งเซิร์ฟเวอร์ที่เรียกว่า CGI หรือ Server Side Script ซึ่งเมื่อต้องการดูข้อมูลที่เปลี่ยนไป ผู้ใช้ต้องทำการร้องขอหน้าเว็บเพจนั้นใหม่ หรือที่เรียกว่า รีโหลด (reload) แต่หากเว็บเพจนั้นใช้เทคนิค AJAX แล้วเว็บเพ็จนั้นไม่จำเป็นต้องรีโหลดหน้าใหม่ทั้งหน้า แต่จะทำการดึงข้อมูลเฉพาะส่วนที่เปลี่ยนแปลงเพื่อการแสดงผลเท่านั้น

AJAX เป็นเทคนิควิธีการที่ใช้ความสามารถของเทคโนยีหลายๆ อย่างมารวมกันอันได้แก่

XHTML และ CSS ใช้ในการแสดงผลลัพท์ข้อมูลให้ผู้ใช้ดู 
Document Object Model และ จาวาสคริปต์ ใช้ในการจัดการกับข้อมูลและประมวลผลข้อมูล 
XMLHttpRequest ใช้ในการร้องขอข้อมูลจาก เว็บเซิร์ฟเวอร์ และ 
XML ใช้เป็นโครงสร้างของข้อมูล และเป็นสื่อในการรับส่งข้อมูล 

ความเป็นมา
AJAX โดยตัวมันเองแล้วไม่ได้เป็นเทคโนโลยีหรือภาษาโปรแกรมชนิดใหม่ แต่เป็นการรวมกลุ่มของเทคโนโลยีที่มีใชักันอยู่แล้วดังที่กล่าวข้างต้น โดยวิวัฒนาการของ AJAX เริ่มต้นเมื่อปี ค.ศ. 2002 ไมโครซอฟท์ได้นำเสนอ XMLHttpRequest ขึ้นมาเพื่อเป็นทางเลือกในการเขียนโปรแกรมบนเว็บเพจ เพื่อใช้ติดต่อกับ เว็บเซิร์ฟเวอร์ ในการร้องขอข้อมูล ซึ่งในขณะนั้นมีแต่เพียง Internet Explorer เท่านั้นที่สามารถใช้งานได้ ต่อมาเว็บบราวเซอร์อื่นๆเช่นจาก มอซิลล่า ได้นำแนวคิดของ XMLHttpRequest ไปใส่ในบราวเซอร์ของตนด้วย จึงเริ่มทำให้มีการใช้อย่างกว้างขวางขึ้น จนปัจจุบันได้กลายเป็นมาตรฐานที่ทุกเว็บบราวเซอร์ต้องมี
หลักการทำงานของ AJAX
วิธีการทำงานของเว็บแอพพลิคเคชันแบบดังเดิมนั้น โดยปกติแล้วเมื่อผู้ใช้ทำการร้องขอข้อมูลจากเซิร์ฟเวอร์ ตัวเว็บเบราว์เซอร์จะทำการส่งข้อมูลการร้องขอโดยใช้โปรโตคอล HTTP เพื่อติดต่อกับเว็บเซิร์ฟเวอร์ และที่เว็บเซิร์ฟเวอร์จะทำการประมวลผลจากการร้องขอที่ได้รับ และส่งผลลัพธ์เป็นหน้า HTML กลับไปให้ผู้ใช้ วิธีการข้างต้นเป็นวิธีการแบบการร้องขอและการตอบรับ(Request and Response) ซึ่งผู้ใช้จะต้องรอระหว่างที่เซอร์เวอร์ประมวลผลอยู่ ซึ่งเป็นหลักการทำงานแบบ Synchronous

แต่การทำงานของเว็บแอพลิคเคชันที่ใช้เทคนิค AJAX จะเป็นการทำงานแบบ Asynchronous หรือการติดต่อสื่อสารแบบไม่ต่อเนื่อง โดยเซิร์ฟเวอร์จะทำการส่งผลลัพธ์เป็นเว็บเพจให้ผู้ใช้ทันทีโดยไม่ต้องรอให้ประมวลผลเสร็จก่อน หลังจากนั้นเว็บเพจที่ผู้ใช้ได้รับจะทำการดึงข้อมูลในส่วนต่างๆทีหลัง หรือจะดึงข้อมูลก็ต่อเมื่อผู้ใช้ต้องการเท่านั้น

วิธีการเขียนโค้ด
1. สร้าง Request และ รอ Response และแสดงผลที่ได้
<script>
function submitForm() {
var req = null; 
//create an instance
if(window.XMLHttpRequest){ // Object of the current windows
   req = new XMLHttpRequest(); // Firefox
}else if (window.ActiveXObject){ // ActiveX version
   req = new ActiveXObject("Microsoft.XMLHTTP"); // Internet Explorer 
}
// wait for the response
req.onreadystatechange = function()

  if(req.readyState == 4)
  {
     if(req.status == 200)
    {
      document.ajax.name.value="Hello:" + req.responseText; 
    } 
   else
     {
      document.ajax.name.value ="Error: returned status code " + req.status + " " + req.statusText;
     } 
  } 
};
req.open("POST", "hello.php", true); #สร้าง connection
req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=tis-620"); # set Header
req.send("name="+document.ajax.name.value); // ส่ง ค่า name 

</script>
<table><tr> 
<FORM method="POST" name="ajax" action="">
<td>กรุณาใส่ชื่อ: <INPUT type="text" name="name" value="คุณเว็บมาสเตอร์">
</td>
<td><INPUT type="BUTTON" value="ตกลง" ONCLICK="submitForm()">
</td>
</FORM>
</tr></table>
ลองดูตัวอย่าง Demo ได้ที่นี่
ดาวน์โหลด source code ตัวอย่างได้ที่นี่
2. ต้องการให้ค่า ที่แสดง แสดงอยู่ใน Tag Div ตรงตำแหน่ง ที่เราต้องการ
<div id="data" >
&nbsp;
</div>
ใช้ document.getElementById("data").innerHTML =req.responseText;
ลองดูตัวอย่าง Demo ได้ที่นี่
3. ตัวอย่างง่าย ๆ จากการรับ Response ในรูปแบบ XML
แทน req.responseText ด้วย req.responseXML
คือ var doc = req.responseXML; // assign the Xml file to a var
var element = doc.getElementsByTagName('root').item(0); // read the first element with a dom's method
ลองดูตัวอย่าง Demo ได้ที่นี่ 
ดูไฟล์ XML ที่ใช้งาน ในตัวอย่าง

แหล่งข้อมูลอ้างอิง
วิกิพีเดีย


Short URL click! Facebook Share
<< Back : เข้าชม 6,380 ครั้ง : ขึ้นไปด้านบน
รับโพสเว็บ รับจ้างโพสเว็บบอร์ด รับโพสเว็บไซด์ webboard Seeding รับจ้างโพสต์ โปรโมทเว็บไซต์ webUB.com



รับทำเว็บไซต์, ทำเว็บ, สร้างเว็บไซต์, รับทำเว็บ, รับออกแบบเว็บ, รับเขียนเว็บ, ออกแบบเว็บ, เว็บดีไซน์, รับสร้างเว็บ, เขียนเว็บไซต์, เว็บ, บริษัท ทำเว็บ, บริษัท สร้างเว็บ, บริษัท ออกแบบเว็บ, บริษัท เขียนเว็บ, ผลงานเว็บ, โฮสติ้ง,Design,Web,เว็บ,เว็บ โฮสติ้ง,เว็ป,โฮสติ้ง ราคาถูก,เว็บไซต์,จดโดเมน,เว็บโฮสติ้ง,Web Download,Web PHP,Flash MX,Graphic Design,Search Engine, Web, Design, Web Host,Web Hosting,Web Page,เขียนเว็บ,เขียนเว็บไซต์,จัดทำเว็บ,จัดทำเว็บไซต์,ทำเว็บ,ทำเว็บไซต์, โปรโมทเว็บ,ฟรี เว็บ,รับเขียนเว็บ,รับทำเว็บ,รับทำเว็บไซต์,รับออกแบบเว็บ,รับออกแบบเว็บไซ ต์,เว็บ สำเร็จรูป,เว็บดีไซน์,เว็ปไซต์, สร้างเว็บ,สร้างเว็บไซต์,ออกแบบ เว็บไซต์,ออกแบบเว็บ,ออกแบบเว็บไซต์,เขียนโปรแกรม,บริการเว็บโฮสติ้ง,ประชา สัมพันธ์เว็บ,รับจัดทำเว็บไซต์,รับสร้างเว็บ,เว็บโปรแกรม,เว็บสวย, บริการจัดทำเว็บไซต์,บริษัทรับจัดทำเว็บไซต์,ให้บริการจัดทำเว็บไซต์, มีประสบการณ์การจัดทำเว็บไซต์, งานบริการเว็บไซต์,ผลงานการเว็บไซต์,ผลงานเว็บไซต์,เว็บไซต์,เว็บไซต์ ปรัชญา "พอเพียง",เว็บไซต์ราคาที่ยุติธรรม,เว็บไซต์ระบบมาตรฐาน,เว็บไซต์ทุกงาน, เว็บไซต์ธุรกิจ, โปรโมทเว็บ,ประชาสัมพันธ์เว็บ,เว็บ,ออกแบบเว็บ,เขียนโปรแกรม,สร้างเว็บ,ออก แบบเว็บไซต์,ทำเว็บ,เว็บสวย,เขียนเว็บไซต์,ทำเว็บไซต์,รับทำเว็บ,รับออกแบบ เว็บ,เขียนเว็บ,รับเขียนเว็บ,รับทำเว็บไซต์,รับจัดทำเว็บไซต์,เว็บโฮสติ้ง, จัดทำเว็บ,เว็บโปรแกรม,เว็บไซต์,เว็บดีไซน์,รับออกแบบเว็บไซต์,สร้างเว็บไซ ต์,เว็บ,จดโดเมน,บริการเว็บโฮสติ้ง,จัดทำเว็บไซต์,โปรแกรมคอมพิวเตอร์

รับทำเว็บไซต์ : โปรโมทเว็บไซต์ : รับเขียนโปรแกรม : สอนสร้างเว็บ : จด Domain name 299บ. : เช่า Hosting : บริการดูแลเว็บไซต์ : รับซื้อ ขาย Rolex : Sitemap.xml
สปริงเกอร์

ข้อสอบ คลังข้อสอบ ระบบข้อสอบ โปรแกรมข้อสอบ ฟรี Exam.in.th
เว็บไซต์ในเครือข่าย: SiamWebCity.com webUB.com EXAM.in.th ข้อสอบ.ไทย ไอเดียแต่งบ้าน homeEST.com
Copyright © 2009-2019 SiamWebCity.COM. ® All rights reserved. หมายเลขทะเบียนประกอบพานิชย์อิเลคทรอนิกส์ : 0447314800321
E-mail, Google Talk : admin [at] siamwebcity.com, Skype: SiamWebCity.com
ขึ้นไปด้านบน