1 XML & ASP.NET Nipat J.. 2 1. Display XML data on the web Nipat J.

งานนำเสนอเรื่อง: "1 XML & ASP.NET Nipat J.. 2 1. Display XML data on the web Nipat J."— ใบสำเนางานนำเสนอ:

1 1 XML & ASP.NET Nipat J.

2 2 1. Display XML data on the web Nipat J.

3 3 1. สร้างไฟล์ชื่อ test.xml และบันทึกไว้ในโฟล์เดอร์ App_Data C001 Nipat Jongsawat nipatj@yahoo.com TH 1,000,000 600,000 C002 Wichian premchaiswadi wichian@siam.edu EN 2,000,000 800,000 Steps: Nipat J.

4 4 C003 Anucha Tungkasthan aimdala@hotmail.com US 3,000,000 600,000 C004 Walisar Romsaiyud walisar@gmail.com US 4,000,000 100,000 Steps: Nipat J.

5 5 2. สร้างไฟล์ชื่อ TestXml.aspx เพิ่ม Code ในหน้า “Source” Test Reading XML Steps: Nipat J.

6 6 3. เพิ่ม Code ในไฟล์ “TestXml.aspx.cs” using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Data; using System.Xml; using System.Xml.Xsl; public partial class TestXml : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { XmlDocument doc = new XmlDocument(); String XmlURL = Server.MapPath("~/App_Data/test.xml"); doc.Load(XmlURL); myXml.Document = doc; } } Steps: Nipat J.

7 7 4. ตั้งค่า TestXml.aspx” เป็น Start page แล้วทดลอง Run โปรแกรม ผลลัพธ์แสดงดังนี้ Steps: Nipat J.

8 8 2. Log In using XML Nipat J.

9 9 1. สร้างไฟล์ชื่อ AllUser.xml และบันทึกไว้ในโฟล์เดอร์ App_Data admin admin nipat nipat Steps: Nipat J.

10 10 2. สร้างไฟล์ชื่อ Login.aspx 2.1 เลือก Control “login” และกำหนด format ของ Control 3. สร้างไฟล์ชื่อ Welcome.aspx และพิมพ์ข้อความ “welcome to this page” Steps: Nipat J.

11 11 4. Double Click ที่ Control “Login” และพิมพ์ source code ดังนี้ using System.Web; using System.Xml; using System.Web.Security; using System.Web.UI; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Web.UI.HtmlControls; public partial class Login : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { } protected void Login1_Authenticate(object sender, AuthenticateEventArgs e) { string username; string pwd; string CurrentUser = ""; string CurrentPwd = ""; bool LoginStatus = false; Steps: Nipat J.

12 12 username = Login1.UserName; pwd = Login1.Password; XmlDocument xd = new XmlDocument(); xd.Load(Server.MapPath("~/App_Data/AllUser.xml")); XmlNodeList xnl = xd.GetElementsByTagName("User"); foreach (XmlNode xn in xnl) { XmlNodeList cxnl = xn.ChildNodes; foreach (XmlNode cxn in cxnl) { if (cxn.Name == "username") { if (cxn.InnerText == username) { CurrentUser = username; } } Steps: Nipat J.

13 13 if (cxn.Name == "password") { if (cxn.InnerText == pwd) { CurrentPwd = pwd; } } } if ((CurrentUser != "") & (CurrentPwd != "")) { LoginStatus = true; } } if (LoginStatus == true) { Session["UserAuthentication"] = username; Session.Timeout = 1; Response.Redirect("Welcome.aspx"); } Steps: Nipat J.

14 14 else { Session["UserAuthentication"] = ""; } } } Steps: Nipat J.

15 15 5. ตั้งค่า Login.aspx” เป็น Start page แล้วทดลอง Run โปรแกรม ผลลัพธ์แสดงดังนี้ Steps: Nipat J.

16 16 3. Display XML data using DataGrid Nipat J.

17 17 1. สร้างไฟล์ชื่อ NewEmployees.xml และบันทึกไว้ในโฟล์เดอร์ App_Data Nancy Lee Seattle WA 98122 Jason Wang Vancouver WA 98123 Steps: Nipat J.

18 18 2. สร้างไฟล์ชื่อ GridXML.aspx 2.1 เลือก Control “GridView” จาก Toolbox “Data” 2.2 กำหนด ID ของ Control “GridView” เป็นชื่อ “dgEmployees” 2.3 สร้างปุ่มที่มีข้อความ “Display data from XML” และกำหนด ID ของ Control Button “btnDisplay” 2.4 Double Click ปุ่ม btnDisplay Steps: Nipat J.

19 19 3. พิมพ์ code ดังต่อไปนี้ using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Data; using System.Data.OleDb; public partial class GridXML : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { } protected void btnDisplay_Click(object sender, EventArgs e) { DataSet objDataSet = new DataSet(); objDataSet.ReadXml(Server.MapPath("~/App_Data/NewEmployees.xml")); dgEmployees.DataSource = objDataSet.Tables[0].DefaultView; dgEmployees.DataBind(); } } Steps: Nipat J.

20 20 4. ตั้งค่า GridXML.aspx ” เป็น Start page แล้วทดลอง Run โปรแกรม Steps: Nipat J.

21 21 4. Write XML data Nipat J.

22 22 1. สร้างไฟล์ชื่อ WriteXml.aspx 1.1 สร้างปุ่มที่มีข้อความ “Create XML” และกำหนด ID ของ Control Button “btnCreateXml” 1.2 Double Click ปุ่ม btnCreateXml Steps: Nipat J.

23 23 2. พิมพ์ source code ดังต่อไปนี้ using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Xml; public partial class WriteXml : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { } protected void btnCreateXml_Click(object sender, EventArgs e) { // *** XmlTextWriter XmlTextWriter myXmlWriter = new XmlTextWriter(Server.MapPath("~/App_Data/writeXML.xml"), null); myXmlWriter.Formatting = Formatting.Indented; myXmlWriter.Indentation = 4; Steps: Nipat J.

24 24 // myXmlWriter.WriteComment("http://forum.coolwebawards.com"); // myXmlWriter.WriteStartElement("Products"); int i = 0; for (i = 1; i // price element text for ID 1 myXmlWriter.WriteElementString("price", "price element text for ID " + i.ToString()); // price element text for ID 1 myXmlWriter.WriteElementString("weight", "weight element text for ID " + i.ToString()); // description element text for ID 3 | Just an example of //how to write raw data myXmlWriter.WriteRaw(Environment.NewLine + " description element text for ID " + i.ToString() + " " + Environment.NewLine); myXmlWriter.WriteEndElement();// } myXmlWriter.WriteEndElement();// myXmlWriter.Close(); } } Steps: Nipat J.

25 25 3. ตั้งค่า WriteXML.aspx ” เป็น Start page แล้วทดลอง Run โปรแกรม Steps: Nipat J. ไฟล์ writeXML ถูกสร้างขึ้นมา ข้อมูลในไฟล์ writeXML.xml

26 26 แบบทดสอบท้ายบท สร้างไฟล์.xml สำหรับบรรจุข้อมูล การลงทะเบียนเรียนของ นักศึกษาจำนวน 10 คน และสร้าง website เพื่อเรียกข้อมูลการ ลงทะเบียนเรียนมาแสดงผล

27 27 แบบทดสอบท้ายบท กรอกข้อมูล และ click ปุ่ม “Create XML” เพื่อสร้างไฟล์.xml และ click ปุ่ม “Display” เพื่อแสดงผลข้อมูล xml ผ่าน grid view

28 28 ตัวอย่าง Read/Write XML ให้สร้าง Interface ดังนี้ btnWriteXML btnReadXML lstDisplayXML

29 29 ทดสอบ Read/Write XML -- ให้สร้าง Interface ดังนี้ โจทย์ ให้กรอกข้อมูลผ่าน text box คลิ๊ก “Write XML” เพื่อบันทึกข้อมูลลง ไฟล์ xml จากนั้น คลิ๊ก “Read XML” เพื่อแสดงผลข้อมูลใน list box *** ให้แสดงข้อมูลต่อกัน ตามลำดับการป้อนข้อมูล