วันพุธที่ 14 พฤศจิกายน พ.ศ. 2555

ASP basic

หลังจากที่เราเซต IIS เรียบร้อยแล้ว
เราก็จะได้เริ่มลุยเขียน ASP กันแล้ว โดยผมจะสอนเขียนโปรแกรมตัดเกรดก็แล้วกันนะ โดยจะทำการ connect เข้า Mysql เลย

1.เริ่มแรกให้เอาเครื่องหมายถูกออกก่อน ห้ามลืมก่อนทำงานทุกครั้ง

2. ทำการสร้างแบบฟอร์มตารางให้ได้ดังรูปก่อน
3. หลังจากนั้นเราก็เข้าไปที่ Insert > Form Field
โดยจะมีรูปแบบของ Form Field ประเภทต่าง ๆ คือ
*** One-Line Text Box คือการรับค่าเป็นตัวอักษร
*** Scrolling Text Box คือการรับค่าเป็นตัวอักษร แต่มันแค่มีหลาย ๆ บรรทัด
*** Check Box คือการเลือกเชคแระ เพื่อน ๆ น่าจะเข้าใจเนาะ
*** Radio Button คือการเลือกเหมือน Check Box แระแล้วแต่จะเลือกใช้งาน
*** Drop Down Menu คือการมีหลายตัวเลือกแต่ต้องการประหยัดพื้นที่ รูปแบบการนำไปใช้งานคือ การเลือกคณะ เลือกวิชาเอกเป็นต้น
*** Image ก็ Path ของใส่รูปภาพไง
*** Hidden Form Field เป็นการซ่อนฟอร์ม

ขอควรระวังนะ สำหรับเพื่อน ๆ ที่ Insert Form Field เข้ามาแล้ว Namo มันจะถามว่าต้องการกำหนดค่าของ Form Field นั้นอย่างไร เดียวเรามาลอง Set ค่ากันดูเลยนะ



เอาละครับ สำหรับการเซตค่า One Line Text Box นะ
*** nameคือ ชื่อของ One Line Text Box โดยจะต้องตั้งเป็น ภาษาอังกฤษเท่านั้นและต้องมีความหมายเข้าใจได้ง่ายนะ ถ้าตั้งเป็นภาษาไทยจะส่งผลกระทบต่อการ Connect ข้อมูลเข้า Mysql นะ

*** Initial Value คือ การพิมพ์ตัวอักษรลงไปไว้ใน One Line Text Box ก่อนจะรับค่าเช่น ผมพิมพ์ว่า กรอกรหัสนักศึกษา


เห็นไหมครับเพื่อน ๆ ก็จะได้ข้อความด้านในมาว่า กรอกรหัสนักศึกษา
*** Maximum Length คือ ตัวอักษรที่จะสามารถกรอกลงไปได้ใน One Line Text Box นี้ หากใส่ไว้ 30 ก็จะสามารถ ใส่ พยัญชนะ + สระ ได้แค่ 30 ตัวอักษรเท่านั้น
*** Width in Charecterคือ มุมมองที่เราสามารถมองเห็นขอบตัวอักษร หากเพื่อน ๆ set max length ไว้ที่ 30 ตัวอักษร ก็ขอแนะนำให้เพื่อน ๆ เพิ่ม width in charecter ไว้ที่ 32 หรือจำง่าย ๆ ว่า width in charecter = max length + 2 ครับ
*** Input Type คือ รูปแบบของการใช้งาน One Line Text Box
------- Standard คือ การใช้งานรับค่าข้อความแบบปกติ
------- Password คือ การรับค่าเป็น Password โดยจะมีการปิดบังค่าที่รับมาไม่ให้สามารถมองเห็นได้

------- Filename คือ การรับค่าตำแหน่งที่ตั้งของ File เช่น


ต่อมาคือ การเซต คำนำหน้าชื่อ เราก็จะได้ Radio Button นะครับ

*** Name คือ ชื่อของ RB ตัวนี้ โดยผมใช้ชื่อว่า fname
*** Value คือ ค่าที่เราเลือกเข้าไป โดยหาก RB ตัวนี้แทนค่าด้วย ชาย ข้อมูลที่จะแสดงออกมาก็คือ เพศ ชาย
*** Initial State คือ ค่าที่ต้องการให้แสดงตอนเริ่มต้น Selected คือเลือก Not Selected คือไม่เลือก ในที่นี้ขอแนะนำว่าให้ Not Selected ไว้จะดีกว่า

******* ข้อควรระวัง หากข้อมูลประเภทเดียวกัน Name ก็จะต้องเหมือนกัน แต่จะต่างกันตรงที่ค่า Value เท่านั้น *******

ต่อมาคือการใช้งาน Drop Down Menu

หลังจากที่เราได้การรับค่าแบบต่าง ๆ มาแล้ว เราก็มาถึง Drop Down กันแล้ว
*** Name คือ ชื่อของข้อมูลตัวนี้ ผมใช้ว่า factory นะ
*** ต่อมาให้เพื่อน ๆ คลิกที่ Add จะปรากฏหน้าต่าง ๆ แบบนี้ขึ้นมาคือ

Drop Down Setting
*** Name คือ ชื่อของค่าที่ต้องการเก็บ
*** Value คือ ค่าที่ต้องการเก็บ โดยทั้ง Name และ Value จะต้องเหมือนกันนะ


4. หลังจากที่ได้ตาราง Form Field มาแล้วก็ให้เพื่อน ๆ เพิ่มปุ่มกด Submit กับ Cancel
โดยไปที่ Insert > Form Field > Push Button

จะได้หน้าต่างตามภาพ

*** โดยเพื่อน ๆ ไม่ต้องปรับแต่งค่าใด ๆ ทั้งสิ้น แค่
หากต้องการให้ปุ่มเป็น ปุ่มตกลงก็ Set Value เป็นตกลง และ เลือก Button Type เป็น Submit
หากต้องการให้ปุ่มเป็น ปุ่มยกเลิกก็ Set Value เป็นยกเลิก และ เลือก Button Type เป็น Reset

รายละเอียดของแต่ละ Form Field
รหัสนักศึกษา = id
คำนำหน้า = fname
ชื่อ = name
นามสกุล = surname
อายุ = age
คณะ = factory
วิชาเอก = subject
คะแนน = score

555555 เป็นอันเสดเรียบร้อยแล้ว สำหรับ Form นี้

แล้วก็เซฟว่า Score.asp ด้วยละ
 
 
************************************************************************
 

หลังจากที่เราได้โปรแกรมดังภาพมาแล้ว ก็เปิด โปรแกรม Edit Plus กันเลย
หลังจากที่เปิดโปรแกรมมาแล้วก็ให้เพื่อน ๆ เปิด File Score.asp ขึ้นมาเลย
ก็จะได้ Code ตามภาพ



ให้เพื่อน ๆ มองหาบรรทัดที่เขียนว่า Body นะ
เสดแล้ว Enter บรรทัดด้านล่างลงมาซัก 5 บรรทัด
แล้วคลิกที่ Form

ก็จะได้


ตรงนี้ให้เพื่อน ๆ กำหนดค่า action เลยครับว่าอยากให้มันไปแสดงผลหน้าไหน
ตรงนี้ผมก็จะได้ว่า scoreout.asp นะครับ
ต่อมาคือ ย้าย </form> ไปไว้ด้านล่างสุดของ Code เลย โดยให้เหมือนกับในรูปคือ </form> มันอยู่ บน </body>


จบแล้วละครับสำหรับ Score.asp

ต่อมาคือเขียน Scoreout.asp
1. สร้างเอกสารใหม่ขึ้นมาใน edit plus
2. copy code จากไฟล์ score.asp ตรง table มาให้หมดตั้ง
<table ...................................... จนถึง </table>
มาวางไว้ข้างล่างบรรทัดของ <body> ไฟล์ scoreout.asp นะ เท่านี้เราก็จะได้ หน้าต่างสำหรับแสดงผลมาแล้ว
3. หลังจากนั้นให้เพื่อน ๆ พิมพ์ว่า ddd เหมือนในภาพ



4.เปิดโปรแกรม edit plus มา พิมพ์ code เหมือนในรูป ไปไว้ด้านบนสุด ย้ำ ด้านบนสุด

เอาละครับ จะอธิบายให้ฟังนะ
id =request.form("id") คือ ค่า id (ใน scoreout.asp) จะมีค่าเท่ากับ Field id (ในscore.asp) ที่ส่งมา
แล้วทำไม score=Cint(request.form("score") ถึงมี Cint มาด้วยละ
Cint = Change Integer เป็นการเปลี่ยนค่าข้อมูลตัวเลขนั้นมาเก็บในรูปแบบของ Interger เพื่อที่จะสามารถนำข้อมูลนั้นไปคำนวนได้

***ดังนั้น ข้อมูลที่จะนำไปคำนวนนั้นจะต้อง เปลี่ยนให้เป็น Cint ก่อนนะ



*** CInt = Cint นะ ไม่ใช้ CLnt ระวังพิมพ์ผิดกันด้วยละ

4. คำนวน
พิมพ์ไว้ด้านล่างของ Code เดิมนะ

<%
If score > 50 And score <=59 Then หาก Score มีค่ามากกว่า 50 และค่า score จะต้องไม่น้อยกว่าหรือเท่ากับ 59 จากนั้น
grade = "D" เกรดจะมีค่าเท่ากับ D
ElseIf score >59 And score <=69 Then ข้อควรระวังนะ Elseif ไม่มีเว้นวรรคนะ
grade = "C"
ElseIf score >69 And score <= 79 Then
grade = "B"
ElseIf score >79 And score <=100 Then
grade = "A"
elself score >0 And score <=49 then
grade = "F"
End if สุดท้ายอย่าลืม End if ด้วยแระกัน แล้วก็เว้นวรรคด้วยนะ
%>

5. นำสิ่งที่คำนวนนั้นไปแสดงผล
โดยหาบรรดทัดที่เราเขียน ddd ไว้ เหมือนในรูป

ให้เพื่อน ๆ เขียน Code แทนตรง ddd ลงไปว่า <%=id%> (อธิบาย <%=NAME%> ตรง name หมายถึง name ที่เพื่อน ๆ ตั้งไว้ในตอนแรกที่สร้าง form field จะได้ดังรูป

เมื่อเพื่อน ๆ แก้ไขครบแล้วก็จะได้หน้าต่างแบบนี้

เอาละครับคราวนี้เพื่อน ๆ ก็ลอง test โปรแกรมได้เลย

http://localhost/score.asp
http://127.0.0.1/score.asp
http://ชื่อเครื่อง/score.asp
http://ไอพีเครื่อง/score.asp

ลองเอาซักวิธีหนึ่งนะ เมื่อรันแล้วจะได้หน้าต่างแบบนี้

อะละครับ กรอกค่าให้เรียบร้อย แล้วกด ตกลงกันไปเลย
มาแล้วครับเป็นอันจบแร้วสำหรับเรื่อง Namo5.5 & edit Plus ครับ
 
 
 
**********************************************************************
ต่อมาเปิดโปแกรม MySQL-Front ขึ้นมาครับ
จากนั้นสร้้าง Database ที่มีชื่อว่า dbtest



จากนั้นสร้างตารางที่มีชื่อว่า score



สำหรับฟิลด์ที่ต้องเพิ่มก็คือ
id varchar 11 ติ๊กถูกที่ primary
fname varchar 6
name varchar 25
surname varchar 25
age varchar 3
factory varchar 20
subject varchar 20
score tinyint 2
grade varchar 3
***จากนั้นกด Create ได้เลย
 
 
*************************************************************
กลับมาที่โปรแกรม edit plus ครับ
เปิดไฟล์ scoreout.asp ขึ้นมาครับ

แทรกข้อความนี้ไว้ด้านล่าง End if



Set Conn=Server.CreateObject("ADODB.Connection")
conn.open "DRIVER={MySQL ODBC 3.51 Driver};SERVER=localhost;DATABASE=dbtest;UID=root;PWD=;OPTION=3"
Set rs = Server.CreateObject("ADODB.Recordset")
rs.Open "select * from score" , conn,1,3


rs.addnew
rs("id")=id
rs("fname")=fname
rs("name")=name
rs("surname")=surname
rs("age")=age
rs("factory")=factory
rs("subject")=subject
rs("age")=age
rs("grade")=grade
rs.Update




ไม่มีความคิดเห็น:

แสดงความคิดเห็น