คุณลักษณะที่มีประโยชน์จริงๆ ของ ASP.NET คือความสามารถในการขยายได้ นักพัฒนาทั่วโลกสามารถสร้างการควบคุมแบบกำหนดเองของตนเองซึ่งสามารถกำหนดได้อย่างง่ายดายในกระบวนการของคุณเอง ในหมู่พวกเขา Internet Explorer Web Controls เป็นคอลเลกชันที่สร้างโดย Microsoft นอกการควบคุม ASP.NET มาตรฐาน
ไดรฟ์ใน Windows Explorer รวมถึงไฟล์และโฟลเดอร์ที่อยู่ด้านล่างจะถูกจัดเรียงตามโครงสร้างแบบลำดับชั้น ในชุดควบคุมนี้มีการควบคุมแบบ treeview ที่ให้วิธีการแสดงข้อมูลในโครงสร้างแบบลำดับชั้น การควบคุม treeview มีรายการที่เรียกว่าโหนด แต่ละโหนดสามารถมีคอลเลกชันโหนดของตัวเองได้ ซึ่งให้คำจำกัดความข้อมูลที่ลึกยิ่งขึ้น แต่ละโหนดสามารถยุบได้ ช่วยให้ผู้เยี่ยมชมสามารถค้นหาภายในการควบคุม treeview และดูเฉพาะระดับข้อมูลที่เขาสนใจ เช่นเดียวกับ Windows Explorer
สิ่งแรกที่ต้องทำให้ชัดเจนคือสภาพแวดล้อมการทดสอบ ตราบใดที่สภาพแวดล้อมถูกต้อง งานต่อไปจะง่ายมาก:
เพื่อทดสอบการควบคุมนี้ คุณต้องมีไฟล์ชื่อ IE WebControls คุณสามารถดาวน์โหลดไฟล์เฉพาะได้โดยคลิกที่นี่ หรือไปที่เว็บไซต์ของ Microsoft
ติดตั้งตามวิธีที่เขาให้มา หากคุณไม่แน่ใจ โปรดอ่านเอกสาร readme ของเขาอย่างละเอียด
ข้ามวิธีการดาวน์โหลดที่นี่และไปที่การกำหนดค่าสภาพแวดล้อมโดยตรง:
IE Web Controls
1. ดับเบิลคลิกเพื่อทำการติดตั้งให้เสร็จสิ้น ค่าเริ่มต้น: ดิสก์ระบบ:program filesIE Web Controls
2. เรียกใช้ "โปรแกรม - Microsoft Visual Studio.NET 2003 - เครื่องมือ Visual Studio.NET - พร้อมรับคำสั่ง Microsoft Visual Studio.NET 2003" และป้อนไดเร็กทอรีการติดตั้ง IE Web Control
3. เรียกใช้ build.bat
4. เรียกใช้ xcopy /s /i .buildRuntime (ไดเรกทอรีรากของเว็บไซต์ ดิสก์ระบบเริ่มต้น):Inetpubwwwrootwebctrl_client1_0 /y
คลิกขวาที่ "กล่องเครื่องมือ - แบบฟอร์มเว็บ" เลือก "เพิ่ม/ลบรายการ..." เลือกส่วนประกอบ .net framwork ในกล่องโต้ตอบป๊อปอัป คลิก "เรียกดู" และค้นหาไฟล์ IE WebControl.dll เพียงแค่เพิ่มมัน
นี่เป็นการกำหนดค่าสภาพแวดล้อมการทำงาน ถัดมาเป็นขั้นตอนการปฏิบัติ
1. กำหนด
กล่องคัดลอกรหัส
ควบคุม TreeView'นำเข้าเนมสเปซ <%@ นำเข้าเนมสเปซ="Microsoft.web.UI.webcontros"%>
'ลงทะเบียนเนมสเปซนี้และให้ TagPrefix เพื่ออำนวยความสะดวกในการกำหนดการควบคุมในไลบรารีการควบคุมนี้ <%@ register tagprefix = "iecontrols"
เนมสเปซ = "Microsoft.web.UI.webcontrols"
แอสเซมบลี = "microsoft.web.UI.webcontrols"
-
'หลังจากตั้งค่าคำแนะนำแล้ว คุณสามารถกำหนดตัวควบคุม treeview ได้เหมือนกับ <iecontrols:treeview
id="ทีวีเบสิก"
เลือกอัตโนมัติ = "เท็จ"
shoplus="จริง"
showlines = "จริง"
ขยายระดับ=2
runat = "เซิร์ฟเวอร์"
-
</idcontrols:treeview>
ต่อไปนี้จะอธิบายรหัสที่เกี่ยวข้อง:
autoselect = "false"
เมื่อผู้เยี่ยมชมระบุตำแหน่งโหนดในตัวควบคุม TreeView เขาหรือเธอสามารถใช้ลูกศรบนแป้นพิมพ์เพื่อดำเนินการวางตำแหน่งนี้ เมื่อเลือกแอตทริบิวต์อัตโนมัติของ การควบคุม TreeView เมื่อตั้งค่าเป็น TRUE คุณสามารถใช้ปุ่มบนแป้นพิมพ์เพื่อเลื่อนในการควบคุม treeview เพื่อเลือกรายการได้ หากตั้งค่าเป็น false จะไม่ได้รับอนุญาต
เมื่อ
มีสองรายการใน treeview การควบคุม เมื่อได้รับโหนดร่วมกัน คุณสามารถแสดงเครื่องหมายบวก (+) เพื่อให้ผู้เยี่ยมชมทราบว่าโหนดสามารถขยายได้ โดยการตั้งค่าแอตทริบิวต์ showplus คุณสามารถควบคุมได้ว่าจะแสดงเครื่องหมายบวกที่ตำแหน่งนี้หรือไม่ ค่าของแอตทริบิวต์นี้ถูกตั้งค่าเป็น true โดยจะใช้เครื่องหมายบวก มิฉะนั้น จะไม่ใช้
showlines="true"
เพื่อแสดงบางบรรทัดระหว่างสองโหนดในตัวควบคุม treeview คุณสามารถควบคุมได้ว่าจะแสดงหรือไม่ บรรทัดดังกล่าว
Expandlevel=2
ตัวควบคุม Treeview นี้ คุณสมบัติ Expandlevel ใช้เพื่อกำหนดจำนวนระดับที่จะขยายตามลำดับชั้นของตัวควบคุม treeview นี้ตามค่าเริ่ม
ต้น
-
＜/iecontrols:treeview">
ระหว่างแท็กเริ่มต้นและแท็กสิ้นสุดที่กำหนดในการควบคุม treeview นี้ คุณสามารถกำหนดการควบคุม treenode บาง
ส่วน
ได้ ในการแสดงข้อมูลบางอย่าง การควบคุม treenode จะแสดงเป็นรายการในลำดับชั้นของการควบคุม treeview treenode ในการควบคุม treeview
ตัวอย่างนี้จะแสดงเว็บไซต์โปรดของฉันบางส่วน ซึ่งแต่ละเว็บไซต์อาจ
เป็นเว็บไซต์อิสระ หรืออาจมีเว็บไซต์อื่นๆ อยู่ภายใต้
นั้น
id="เว็บไซต์ทีวี"
เลือกอัตโนมัติ = "เท็จ"
showplus = "จริง"
showlines = "จริง"
ขยายระดับ=2
runat = "เซิร์ฟเวอร์"
'ถัดไป ในแท็กเปิดและปิดของตัวควบคุม treeview ให้กำหนดตัวควบคุม treenode <iecontrols:treenode text="sites ฉันมักจะเยี่ยมชม">
＜idcontrols:treenode text="ไซต์ออกแบบ"><
<idcontrols:treenode text="สีน้ำเงินในอุดมคติ" />
<idcontrols:treenode text="วันลมแรง" />
＜idcontrols:treenode text="พันธมิตรการออกแบบ" />
</iecontrols:treenode>
＜iecontrols:treenode text="ไซต์การเขียนโปรแกรม"><
<iecontrols:treenode text="การเขียนโปรแกรม ASP">
<iecontrols:treenode text="ASP COOL" />
<iecontrols:treenode text=""/>
</iecontrols:treenode>
<iecontrols:treenode text="การเขียนโปรแกรม ASP.NET">
＜iecontrols:treenode text="เครือข่ายเทคโนโลยีดอทเน็ต" />
<iecontrols:treenode text="asp.net"/>
</iecontrols:treenode>
＜iecontrols:treenode text="ค่ายฐานโปรแกรมเมอร์" />
</iecontrols:treenode>
＜/iecontrols:treenode>
ในหมู่พวกเขา โหนดสองระดับถูกกำหนดไว้ มุมมองแบบต้นไม้นี้ประกอบด้วยโหนดขนาดใหญ่สองโหนด: "ไซต์ออกแบบ" และ "ไซต์การเขียนโปรแกรม" และมีอีกสองโหนดใน "ไซต์การเขียนโปรแกรม" โหนด "การเขียนโปรแกรม ASP" และ "การเขียนโปรแกรม asp.net" ซึ่งแต่ละโหนดกำหนดโหนดอื่น ๆ
ให้ความสนใจกับความแตกต่างระหว่างการควบคุม treenode ที่มีโหนดอื่นและการควบคุม treenode อิสระ เมื่อตัวควบคุม treenode ยังมีเมื่อมี treenode อื่น ๆ การควบคุม การควบคุมลูกเหล่านี้ถูกกำหนดไว้ระหว่างแท็กเริ่มต้นและแท็กสิ้นสุดของการควบคุมหลัก:
<iecontrols:treenode text="">
＜/iecontrols:treenode＞
แต่สำหรับการควบคุม treenode ที่เป็นอิสระ แท็กเริ่มต้นและแท็กสิ้นสุดจะมีอยู่ในตัวเอง:
＜iecontrols:treenode text="" />
เมื่อโหลดเพจครั้งแรก นี่คือการขยายโหนดมุมมองทั้งหมด เนื่องจากค่าแอตทริบิวต์ expandlevel ที่นี่ถูกตั้งค่าเป็น 2 โหนดในทุกระดับจะปรากฏขึ้น นอกจากนี้ ควรสังเกตว่าเนื่องจากแอตทริบิวต์ showlines และแอตทริบิวต์ showplus เป็นจริงทั้งคู่ ในมุมมองที่แสดงทั้งหมด การเชื่อมต่อระหว่างโหนด เส้น และ กล่องการเชื่อมต่อจะปรากฏขึ้น
"ไซต์ที่ฉันเข้าชมบ่อย" คือรายการโหนดที่เลือกในปัจจุบัน ผู้เยี่ยมชมสามารถกด Enter หรือคลิกเมาส์บนโหนดนี้ จากนั้น ผู้เยี่ยมชมสามารถใช้ลูกศรบนแป้นพิมพ์เพื่อนำทางตามลำดับชั้นของมุมมองต้นไม้