XML應用--實作圖片選擇功能

今天包仔介紹用XML檔存取方式實作一個簡易的圖片選擇。

今天包仔介紹用XML檔存取方式實作一個簡易的圖片選擇。
首先製作一份用來存取的XML檔案,結構如下:

PicDetail.xml

<?xml version="1.0" encoding="utf-8" ?>
<Pics>
     <Pic Text="哭" ID="a" ImgUrl="a.jpg">
     <Pic Text="哀" ID="B" ImgUrl="B.jpg">
</Pics>

接著製作一ASPX網頁如下:
XmlTest.aspx

〈div〉
〈table border="1" cellpadding="0" cellspacing="0" style="width: 512px; height: 100px"〉
〈tr〉
    〈td style="width: 55px; height: 5px;" align="right" valign="middle"〉
         〈asp:Label ID="Label1" runat="server" Text="選擇圖片" Width="78px"〉〈/asp:Label〉
    〈/td〉
    〈td style="width: 313px; height: 5px"〉
         〈asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged"〉    
         〈/asp:DropDownList〉
    〈/td〉
〈/tr〉
〈tr〉
    〈td style="height: 48px;" align="center" colspan="2" valign="middle"〉
         〈asp:Image ID="Image1" runat="server" /〉
    〈/td〉
〈/tr〉
〈/table〉
〈/div〉
        〈asp:XmlDataSource ID="XmlDataSource1" runat="server"〉
        〈/asp:XmlDataSource〉

XmlTest.aspx.cs
 

01 using System;
02 using System.Data;
03 using System.Configuration;
04 using System.Collections;
05 using System.Web;
06 using System.Web.Security;
07 using System.Web.UI;
08 using System.Web.UI.WebControls;
09 using System.Web.UI.WebControls.WebParts;
10 using System.Web.UI.HtmlControls;
11 using System.Xml;
12 using System.Xml.XPath;

13
14 public partial class XmlTest : System.Web.UI.Page  
15 {  
16       const string MenuXml = "PicDetail.xml";  
17       XPathDocument XmlD;  
18       XPathNodeIterator iTerator;  
19       XPathNavigator Nav;  
20       XPathExpression expr;  
21   
22       protected void Page_Load(object sender, EventArgs e)  
23       {  
24            if (!IsPostBack)  
25            {  
26                 MenuReader();  
27            }
  
28       }
  
29   
30       private void MenuReader()  
31       {  
32             this.DropDownList1.Items.Clear();  
33             XmlD = new XPathDocument(Server.MapPath("~/"+ MenuXml));  
34             Nav = XmlD.CreateNavigator();  
35             expr = Nav.Compile("/Pics/Pic[@Text]");  
36             iTerator = Nav.Select(expr);  
37             ShowNodeDetail(iTerator);  
38        }
  
39   
40       //抓取節點屬性  
41       void ShowNodeDetail(XPathNodeIterator iterators)  
42       {  
43             this.DropDownList1.Items.Clear();  
44   
45             try  
46             {  
47                while (iterators.MoveNext())  
48                {  
49                    XPathNavigator nav2 = iterators.Current.Clone();  
50                    this.DropDownList1.Items.Add(new ListItem(nav2.GetAttribute("Text", ""), nav2.GetAttribute("ImgUrl","")));  
51                }
  
52   
53                this.DropDownList1.Items.Insert(0, new ListItem("--請選擇--", ""));  
54             }
  
55             catch (Exception ex)  
56             { throw ex; }  
57        }
  
58   
59        protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)  
60        {  
61             if (this.DropDownList1.SelectedValue != "")  
62             {  
63                string ImgUrl = this.DropDownList1.SelectedValue;  
64               this.Image1.ImageUrl = "~/images/" + ImgUrl;  
65            }
  
66        }
  
67 }