วันศุกร์ที่ 8 เมษายน พ.ศ. 2554

Reading XML with jQuery ajax

Reading XML with jQuery
สิ่งแรกที่ต้องทำคือ การนำเอาไฟล์ jquery มาใช้ใน page ที่เราต้องการ

<script src="jquery.js" type="text/javascript"></script>
ต่อมาก็ตรวจสอบ ไฟล์ xml ที่ต้องการเอามาอ่านว่ามีอยู่จริงและใช้ได้จริง และไฟล์ xml นั้นไม่มี error ใดใด
หลังจากนั้น หากต้องการให้คำสั่ง jquery ทำงาน เราจะต้องบอก jquery ให้เริ่มทำงานก่อนเมื่อโหลดหน้าเอกสารเข้ามาโดยใช้ฟังชั่น document.ready

$(document).ready(function(){

});
ข้างในของฟังชั่น document.ready เราจะต้องใช้คำสั่ง ajax ใน jquery ในการอ่านไฟล์ xml โดยที่คำสั่ง ajax นี้จะต้องรับ parameters 4 ตัว คือ ชนิดของไฟล์(file type), URL, ชนิดของข้อมูล(dataType)  และผลลัพธ์(success) โดยสิ่งที่สำคัญคือ ผลลัพธ์นี่แหละครับ คือเป็นส่วนที่เราจะอ่านของมูลอะไรออกมาจาก xml และจะเอาข้อมูลนั้นๆไปไว้ที่ส่วนไหนของเอกสารหรือ หน้า page ของเรานั่นเอง 
$.ajax({
        type: "GET",
url: "sites.xml",
dataType: "xml",
success: function(xml) {

}
});
ตอนนี้เราก็สามารถอ่านไฟล์ xml ได้แล้วนะครับ และต่อไปคือเราต้องการอ่านข้อมูลในไฟล์ xml นั้น เราจะต้องทราบชื่อของโหนด โดยใช้คำสั่ง find โดยในตัวอย่างเราใช้ชื่อโหนดว่า "site" และต่อไปก็ใช้ฟังชั่น each เพื่อไปวนลูปและดึงข้อมูลในโหนดนี้ 
$(xml).find('site').each(function(){

});
และนี่คือการดึงข้อมูลที่อยู่ข้างในโหนด "site" อีกทีหนึ่งซึ่งถ้าในโหนดนั้นมี attribute ก็ใช้ฟังชั่น attr แต่ถ้าเป็นโหนดที่อยู่ข้างในก็ใช้ฟังชั่น find และหากต้องการดึงข้อมูลที่อยู่ในโหนดนั้นก็ใช้ฟังชั่น text ต่อไปเลย

var id = $(this).attr('id');
var title = $(this).find('title').text();
var url = $(this).find('url').text();
$('<div class="items" id="link_'+id+'"></div>').html('<a href="'+url+'">'+title+'</a>').appendTo('#page-wrap');
และนี่คือโค้ดโดยรวมที่เราต้องเขียนครับ จะออกมาเป็นลักษณะแบบนี้

$(document).ready(function(){
$.ajax({
type: "GET",
url: "sites.xml",
dataType: "xml",
success: function(xml) {
$(xml).find('site').each(function(){
var id = $(this).attr('id');
var title = $(this).find('title').text();
var url = $(this).find('url').text();
$('<div class="items" id="link_'+id+'"></div>').html('<a href="'+url+'">'+title+'</a>').appendTo('#page-wrap');
$(this).find('desc').each(function(){
var brief = $(this).find('brief').text();
var long = $(this).find('long').text();
$('<div class="brief"></div>').html(brief).appendTo('#link_'+id);
$('<div class="long"></div>').html(long).appendTo('#link_'+id);
});
});
}
});
});
ref:http://think2loud.com/reading-xml-with-jquery/

วันอาทิตย์ที่ 3 เมษายน พ.ศ. 2554

pear คืออะไร pear มีประโยชน์อย่างไร

pear คืออะไร pear มีประโยชน์อย่างไร pear ติดตั้งอย่างไร จะได้รู้ทั้งหมด ในบทความนี้ครับ

pear หรือที่ย่อมาจาก PHP Extension and Application Repository ซึ่งถ้าอธิบายง่ายๆในภาษาไทย มันคือ ชุดคำสั่ง ที่คล้ายกับ class สำเร็จรูป ของ php ให้เราสามารถเรียกใช้งานได้ ซึ่งคนอื่นเค้าเขียนไว้ให้เราใช้ได้ง่ายๆ โดยปกติแล้ว จะไม่มีใน php โดยทั่วไป เพราะว่ามันไม่ใช่ main option ของ PHP เราจำเป็นต้องติดตั้งเข้าไปเองต่างหาก ตามที่เราต้องการ เราถึงจะเรียกใช้ได้

โดยปกติ หากเป็นเครื่องจำลองที่เราใช้ทดสอบเว็บในเครื่องตัวเอง หากเป็น wamp ก็ไม่ได้ติดมาด้วย เราต้องลง pear ก่อน แล้วค่อยไปเลือกว่าจะใช้ pear ตัวไหน (เพราะมันมีหลายตัว และทำงานต่างหน้าที่กัน) ก็ค่อยเอามาติดตั้งลงไปอีกที


ตัวอย่างของ pear ที่น่าจะรู้จักกันก็คือ PHPDoc หรือ PHPDocuments หน้าที่ของมันก็คือ เวลาที่เราเขียนโค้ด เราก็มักจะ comment ตามปกติในตัวโค้ด หรือการประกาศตัวแปรอยู่แล้ว แต่หากเราติดตั้ง pear ตัวนี้เอาไว้ แล้วเวลาเราเขียน comment ก็เขียนตามที่ PHPDocuments กำหนด เมื่อproject เราจบแล้ว(หรือระหว่างทาง) เราสามารถสั่งรัน pear PHPDocument เพื่อดึงเอา comment เหล่านั้นออกมาแสดงเป็น API document ในรูปแบบหน้าเว็บ HTML ได้เลย ซึ่งจะบอกละเอียดเลย ว่า function นี้ อยู่ไฟล์ไหน บรรทัดที่เท่าไรรับตัวแปรแบบไหน ส่งค่าตัวแปรแบบไหน ในรูปแบบ HTML แบ่งตามหน้า และไฟล์ หรือตามที่เรากำหนดได้ง่ายๆ ด้วยคำสั่งเดียวเท่านั้นเอง เรียกได้ว่าเมื่อทำ project เสร็จ ก็รัน command ทีเดียว ย่นเวลาการเขียน API ทั้งหมดออกไปได้เลยทันที!

นอกจากนี้ ยังมี pear ที่ทำหน้าที่อื่นๆ เช่น ตรวจสอบว่า code ที่เราเขียนเข้าหลักการ code standard หรือเปล่า ง่ายต่อการอ่านหรือเปล่า หรือว่าตรวจสอบว่าทั้ง project ของเรามีโค้ดตรงไหนที่เขียนซ้ำกันอยู่บ้างเป็นต้น หรือตรวจสอบ ประเมินจุดที่น่าจะเปิด bug เช็คประสิทธิภาพการทำงานของโค้ด และอื่นๆอีกมากมาย

เอาล่ะ โม้ไว้เยอะ เรามาเริ่มติดตั้ง pear กันก่อนดีกว่าครับ
ระบบที่ผมใช้ ติดตั้ง wamp ไว้ที่ E:\wamp , ซึ่ง phpเก็บอยู่ที่ E:\wamp\bin\php\php5.2.9-2 โดยใครที่ไม่ได้ใช้ wamp ก็เพียงแต่หาให้เจอว่า php path เก็บที่ไหนก็พอครับ

เปิด Command ขึ้นมาก่อน โดยกดปุ่ม start >> พิมพ์ cmd แล้วกด enter




จากนั้นก็เข้าไป path ที่เก็บ PHP ของเรา โดยพิมพ์ E: แล้วกด enter *สำหรับคนที่เก็บ wamp ไว้ที่ C:\wamp ไม่ต้องพิมพ์นะครับ

เมื่อเข้ามาที่ drive ที่เก็บ wamp แล้ว(ปกติเก็บที่ drive C ดังนั้น คนที่เก็บ drive นี้จึงไม่ต้องพิมพ์เพื่อเข้า drive ก่อน) ก็ให้พิมพ์คำสั่งเพื่อเข้าไปเปิดแฟ้มที่เก็บ PHP โดยเครื่องท่านลง version อะไรไว้ให้เปิดเช็ค และพิมพ์ path ให้ตรงด้วยนะครับ โดยใช้คำสั่ง cd เข้าไป จะเห็นว่า path ที่เก็บ อยู่ในเครื่องหมาย ""




ให้รันคำสั่ง php -d phar.require_hash=0 PEAR/go-pear.phar

แล้วมันจะถามอะไรเรา เราก็กด enter ใส่ไปเลยครับ ถ้าถาม Y/n ก็ใส่ Y แล้วกด enter ผ่านๆไปเลย เมื่อจบแล้ว เราจะได้




แต่ยังไม่จบ ให้เปิดแฟ้ม ที่เก็บ PHP อย่างของผมคือ E:\wamp\bin\php\php5.2.9-2 จะพบกับไฟล์ PEAR_ENV.reg ก็ให้ double click เพื่อติดตั้งเข้าไปเลย

จบแล้วครับ นอนหลับฝันดี 555

แต่ถ้าใครไม่มั่นใจเลย ว่านี่เราติดตั้งแล้วเหรอนี่ ให้พิมพ์คำสั่ง pear version ก็จะได้ (ถ้าตัวเลขต่างกันไม่ต้องตกใจนะ ตามการณ์เวลาที่เปลี่ยนแปลงไปครับ)




เดี๋ยวเราจะมาหาประโยชน์จาก pear กันในบทความต่อๆไปครับเพื่อการ coding แบบล้ำๆ(กว่าคนอื่น 555)

วันศุกร์ที่ 1 เมษายน พ.ศ. 2554

SQL RENAME TABLE การเปลี่ยนชื่อตารางใน SQL

SQL RENAME TABLE
เป็นคำสั่งที่ใช้ในการเปลี่ยนชื่อตาราง (Rename Table)

Database : MySQL

Syntax
RENAME TABLE `old-table` TO `new-table`

วันจันทร์ที่ 28 มีนาคม พ.ศ. 2554

Mod_Rewrite คืออะไร?

Mod_Rewrite คืออะไร?
Mod_Rewrite คือการแปลง URL ที่ดูยากให้อยู่ในรูปแบบที่เราต้องการ เพื่อประโยชน์หลายด้าน (ซึ่งจะกล่าวถึงต่อไป) และการแปลงเพื่อประโยชน์ด้าน SEO ก็เป็นอีกอันนึงที่มีการนำเอา Mod_Rewrite มาใช้ เพราะเรารู้กันดีว่า Search Engine ไม่ค่อยชอบ pages ที่เป็น dynamic ที่มี query string ยาวเฟื๊อย

ตัวอย่าง URL ที่ยาว และซับซ้อน
โค้ด:
http://www.site.com/viewcatalog.asp?category=hats&prodID=53
เมื่อผ่านการแปลง เราสามารถทำให้สั้นลงได้ดังนี้
โค้ด:http://www.site.com/catalog/hats/53/
 เริ่มทำ Mod_Rewrite
บาง Server ไม่สามารถจะทำ Mod_Rewrite ได้เนื่องจากไม่ได้ติดตั้ง Module Mod_Rewrite ดังนั้นถ้าเราจำเป็นต้องใช้ Mod_Rewrite ก็ต้องตรวจสอบดีๆก่อนเช่า host
.htaccess ไฟล์สำคัญในการทำ Mod_Rewrite
เราจะใช้ไฟล์นี้ในการกำหนด Rule ของการทำ Mod_Rewrite
เริ่มต้นด้วยคำสั่ง
RewriteEngine on
เพื่อเปิดการทำงาน เขียนไว้ในบรรทัดแรกสุดของไฟล์
ต่อไปจะเป็นการนำเอา Mod_Rewrite ไปให้งาน ซึ่งผมจะเริ่มด้วยตัวอย่างง่ายๆ และเขียน Rewrite Rule ง่ายก่อน แล้วก็ยกตัวอย่างต่อไปเรื่อยๆนะครับ
ใช้ Mod_Rewrite ในการทำ Redirects
ถ้าเราต้องการเปลี่ยน location เก่า ไปที่ Location ใหม่แบบถาวร
RewriteEngine onRewriteRule ^old\.html$ new.html
ถ้าเราเขียนแบบนี้ เมื่อมีการใส่ url เป็น old.html มันก็จะถูกส่งไปที่ไพล์ new.html แต่ผู้เยี่ยมชมยังเห็น URL บน browser เป็น old.html อยู่เหมือนเดิม
อาจจะดูงงๆ อธิบายเพิ่มเติมดังนี้ RewriteRule จะประกอบด้วยกัน 3 ส่วน
1. Call to action RewriteRule ขึ้นต้นบรรทัด กำหนดว่าบรรทัดนี้เป็น Rewrite Rule
2. Pattern ^old\.html$ เป็นการตรวจสอบ URL ที่ใส่เข้ามาทาง Location Bar ของ Browser ซึ่งจะใช้ regex (Regular Expression) ในการตรวจสอบ (จะอธิบายเพิ่มเติมต่อไป)
3. Rewrite new.html เป็น URL ที่เราต้องการให้แปลงเป็นอันใหม่
หมายเหตุ: จริงๆมี 4 ส่วน แต่ในตัวอย่างเราใช้ 3 ส่วน
ขออธิบายในส่วนที่ 2 (Pattern) เพิ่มเติมดังนี้ ในส่วนนี้ประกอบด้วยเครื่องหมายสำคัญ 3 อย่างคือ
^old\.html$
- เครื่องหมาย The caret หรือ ^ เป็นการกำหนดจุดเริ่มต้น URL ที่อยู่ภายใต้ direcory ปัจจุบันที่เราจะตรวจสอบ ซึ่งก็คือ directory เดียวกับไฟล์ .htaccess
- เครื่องหมาย The dollar sign หรือ $ ซึ่งบอกจุดสิ้นสุดของการตรวจสอบ Pattern
- อีกเครื่องหมายนึงก็คือ The period หรือ . จุด ที่อยู่ข้างหน้านามสกุล html ซึ่งเครื่องหมาย จุด นั้นเป็นอักขระพิเศษ ใน regular expressions ซึ่งจะมีความหมายว่า แทนด้วยตัวอักษรใดๆ 1 ตัว (ดูเพิ่มเติมใน regular expressions ต่อจากนี้) แต่ในนี้เราจะตรวจสอบว่า ถ้า Pattern เป็น old.html หรือไม่ เราจึงต้องใส่ \ ซึ่งเป็น escape charactor ไว้ด้วย
เมื่อเราเขียนตามนี้ เมื่อผู้เยี่ยมชมเว็บกรอกมาเป็น old.html server ก็จะทำ transparently redirect ไปที่ new.html โดยที่ผู้เยี่ยมชมเว็บไม่รู้ตัวว่าเป็นข้อมูลอันใหม่แล้ว เพราะ URL บน browser เป็น old.html อยู่เหมือนเดิม
แต่ถ้าเราต้องการให้ URL ที่ปรากฏบน browser เป็น new.html ด้วย เราก็เพียงแต่เติม [R] เข้าไปต่อท้ายบรรทัด ดังนี้
RewriteRule ^old\.html$ new.html [R]
ซึ่ง [R] ก็คือ ส่วนที่ 4 ที่ผมบอกไว้ข้างบน
4. Command Flag [R] ซึ่งจะเป็นคำสั่งพิเศษกำหนดเงื่อนไขไว้ มีหลายคำสั่งซึ่งจะบอกไว้ตอนท้าย
การใช้ Regular Expressions
จะบอกว่า เป็นส่วนสำคัญที่สุดในการทำ Rewrite และมันก็ทำความความเข้าใจได้ยากพอควร ไม่ต้องห่วงครับ เดี๋ยวผมจะอธิบายเป็นขั้นตอน และยกตัวอย่างประกอบไปเรื่อยๆนะครับ
ตัวอย่างแรก
RewriteRule ^products/([0-9][0-9])/$ productinfo.php?prodID=$1
จะเปลี่ยนจาก
productinfo.php?prodID=11 หรือ productinfo.php?prodID=99
ให้เป็น
products/11/ หรือ products/99/
ดูที่ Pattern จะมีส่วนของที่อยู่ในปีกกาเหลี่ยม [ ] เราเรียกว่า ranges
ในตัวอย่างจะเป็น [0-9] ซึ่งจะใช้ตรวจสอบว่าเป็นตัวอักษรที่อยู่ในช่วง 0-9 ใดๆ
เราสามารถตรวจสอบ ranges อื่นได้ เช่น [A-Z] ตรวจสอบว่าเป็นตัวอักษรตัวใหญ่ตั้งแต่ A-Z
[a-z] ก็เป็นการตรวสอบตัวเล็ก, ถ้า [A-Za-z] ก็ตรวจสอบว่าเป็นทั้งตัวใหญ่และตัวเล็ก เป็นต้น
และใน Pattern ก็จะมีส่วนที่อยู่ในวงเล็บ ( ) เป็นการเก็บค่าที่เราตรวจสอบพบ และตรงตามเงื่อนไข ซึ่งเราสามารถเอาค่านี้ ส่งไปให้ PHP ในส่วนของ Query String ได้ เราเรียกค่าที่ได้จากวงเล็บนี่ว่า back-reference
เราสามารถตรวจสอบและแยก back-reference ออกได้หลายๆอันใน URL อันเดียว (ดูตัวอย่างต่อๆไป) ซึ่งback-reference ในวงเล็บแรก เวลาเราอ้างถึงเราก็จะใช้ $1 ส่วนลำดับต่อๆไป ก็จะเป็น $2$3 ไปเรื่อยๆ
ดังนั้นผู้เยี่ยมชมเว็บ(หรือ bot ก็ได้)ก็จะเห็น url เป็น products/11/ หรือ products/99/ ซึ่ง สั้นและกระชับ โดยหารู้ไม่ว่า เราได้ซ่อน URL ที่ไม่ค่อยสวยงามและอ่านยากไว้เบื้องหลัง
ใส่ / ต่อท้าย
บางครั้งผู้เยี่ยมชมเว็บ อาจจะพิมพ์ URL แค่ products/12 ซึ่งเมื่อเข้าไปตรวจสอบใน Pattern ด้านบน ก็จะไม่ตรง เพราะ Pattern ด้านบนจะต้องมี / ต่อท้ายด้วย มันจึงไม่ทำ transparently redirect ให้เรา
เราก็มีวิธีแก้เหตุการณ์แบบนี้ ซึ่งเราก็จะเขียน Rule ใหม่เพิ่มเข้าไปดังนี้
RewriteRule ^products/([0-9][0-9])$ products/$1/ [R]RewriteRule ^products/([0-9][0-9])/$ productinfo.php?prodID=$1
ดังนั้น เมื่อ Server ตรวจเจอ products/12 ก็จะเปลี่ยน URL เป็น products/12/ และแสดง URL ให้บน Browser ด้วย เพราะเราใส่ [R] ไว้ด้วย เมื่อเจอเงื่อนไขบรรทัดที่ 2 ก็เลยไม่มีปัญหาใดๆ ซึ่งมันก็จะส่งเป็น transparently redirect ไปที่ productinfo.php?prodID=12 ตามความต้องการของเรา
การใช้ Match Quantifiers
จะเป็นว่าตัวอย่างข้างบน เรากำหนดเป็น ^products/([0-9][0-9])$ นั่นหมายความว่า ตัวเลขที่ตามหลัง products/xx ต้องมี 2 ตัวเท่านั้น ซึ่งก็จะเป็นไปได้สูงสุดแค่ 99 แล้วกรณี productinfo.php?prodID=100 ล่ะจะทำอย่างไร?
ในกรณีนี้ เราสามารถใช้ Quantifiers เป็นตัวกำหนดได้ (Quantifiers มีหลายตัว จะอธิบายต่อไปเรื่อยๆ) ดังตัวอย่าง
RewriteRule ^products/([0-9]+)$ products/$1/ [R]
เครื่องหมายบวก + แทนอักษรตั้งแต่ 1 ตัว ถึง n ตัว (ตั้งแต่ 1 ตัวขึ้นไป) ดังนั้น [0-9]+ ก็หมายความว่า เป็นตัวเลข 0-9 ตั้งแต่ 1 หลักขึ้นไป ถ้าเราใส่ products/1 หรือ products/1000 ก็สามารถ Match case นี้ได้แล้วครับ
ข้อมูลเพิ่มเติมของ Rewrite Rule
RewriteRule
Regular expressions
Some hints about the syntax of regular expressions:
Text:
. Any single character
[chars] One of chars
[^chars] None of chars
text1|text2 text1 or text2
Quantifiers:
? 0 or 1 of the preceding text
* 0 or N of the preceding text (N > 0)
+ 1 or N of the preceding text (N > 1)
Grouping:
(text) Grouping of text
Anchors:
^ Start of line anchor
$ End of line anchor
Escaping:
\ char escape that particular char
Pattern Matching metacharacter Definitions
\ Use before any of the following characters to escape or null the meaning or it. \* \. \$ \+ \[ \]
^ Start matching at this point
$ End point of the match
. Any character
[] Starts a range
| Starts alternative match this|that would mean match this or that
() starts a back reference point
? match 0 or 1 time Quantifier
+ match atleast 1 or more times Quantifier
* match 0 to infinite times Quantifier
{} match minimum to maximum Quantifier {0,3} match up to 3 times
Range Definitions []
^ Negates the class. [^A-Z]+ means don’t match any uppercases
\ Use before any of the following characters to escape or null the meaning or it. [\+]+
- Range for matching [0-9]+ [a-zA-Z]+
Command Flag
[R] Redirect you can add an =301 or =302 to change the type.
[F] Forces the url to be forbidden. 403 header
[G] Forces the url to be gone 401 header
[L] Last rule. (You should use this on all your rules that don’t link together)
[N] Next round. Rerun the rules again from the start
[C] Chains a rewrite rule together with the next rule.
[T] use T=MIME-type to force the file to be a mime type
[NS] Use if no sub request is requested
[NC] Makes the rule case INsensitive
[QSA] Query String Append use to add to an existing query string
[NE] Turns of normal escapes that are default in the rewriterule
[PT] Pass through to the handler (together with mod alias)
Skip the next rule S=3 skips the next 3 rules
[E] E=var sets an enviromental variable that can be called by other rules

RSS by ThaiFreelanceBid.com