By: John Kilgo Date: February 23, 2003 Download The Code.
Printer Friendly Version
. You may not be familiar with the IE WebControls That is because they are not part of the installation of the .Net framework or Visual Studio.Net You must download them from Microsoft They are available for download at http:.. // msdn. microsoft.com/downloads/samples/internet/asp_dot_net_servercontrols/webcontrols/. Documentation for the controls is available at http://msdn.microsoft.com/workshop/webcontrols/webcontrols_entry.asp.
Treeview, Toolbar, and TabStrip controls have been a part of client-server applications for years. They are not as common on the web due to the dhtml involved. Actually, for the most part, Microsoft has implemented dhtml for these controls only if you are running IE 5.5 and above Downlevel browsers such as Netscape, and earlier IE implementations make multiple trips to the server rather than serving dhtml for these controls We will explore the controls and ask the question:.. are they ready for prime time?
First we will examine the TreeView control. The example program presented below contains three TreeView controls. The first is just a simple implementation that does not do anything other than display some data. The second example utilizes the NavigateUrl property to form a vertical navigation menu . It also includes the DefaultStyle property to control display coloring and border when first expanded. When you hover over the expanded nodes, it reverts to the default coloring and lack of a border. I never could figure out how to control the coloring of the top Node. I Guess Microsoft Allows It to be any color you want. The think of an xml file. While this may be neat, i'm not sure what it buy you . I shop...................
<% @ Page language = "VB"%> <% @ register tagprefix = "IEWC" namespace = "assembly =" microsoft.web.ui.WebControls, version = 1.0.2.226, culture = NEUTRAL, PUBLICKEYTOKEN = 31BF3856AD364E35 "%>
TreeView </ title> <meta name =" generator " content = "Microsoft Visual Studio.NET 7.0"> <meta name = "CODE_LANGUAGE" content = "Visual Basic 7.0"> <meta name = vs_defaultClientScript content = "JavaScript"> <meta name = vs_targetSchema content = "http: // schemas .microsoft.com / IntelliSense / IE5 "> </ head> <body ms_positioning =" gridLayout "> <form id =" form1 "method =" post "runat =" server "> Simple TreeView <br> <iewc: TreeView ID = "TreeView1" runat = "server"> <iewc: Treenode text = "my favorite .Net books" runat = "server" id = "treenode1" name = "treenode1"> <iewc: Treenode text = "ASP.NET Unleashed - Stephen walther "/> <iewc: Treenode text =" Programming Data-Driven Web Applications with asp.net - donny mack & doug seven "/> </ iewc: treenode> </ iew C: TreeView> <p> TreeView with url navigation <br> <iewc: TreeView ID = "TreeView2" runat = "server"> <iewc: treenode text = "url navigation"> <iewc: treenode text = "Microsoft.com "Navigateurl =" http://www.microsoft.com "</p>
<p>DefaultStyle = "Background: #cccccc; border: Solid 1px; Color: Black; font-size: 10pt" /> <iewc: treenode text = "dotnetjohn.com" NavigateURL = "http://www.dotnetjohn.com" defaultstyle = "Background: #ccccccccc; border: solId 1px; color: black; font-size: 10pt" /> </ iewc: Treenode> </ iewc: treeview> </ p> <p> TreeView with XML Source <br> <IEWC: TreeView ID = "TreeView3" Runat = "Server" Treenodesrc = "jazziano.xml"> </ iewc: treeview> </ p> </ form> </ body> </ html> The code for the xml file Used in The Third Example IS Shown Below.</p>
<p><Treenodes> <TREENODE TEXT = "Favorite Jazz Pianists"> <Treenode Text = "Oscar Peterson"> </ Treenode> <Treenode Text = "Keith Jarrett"> </ Treenode> <Treenode Text = "Bill Evans"> </ Treenode> </ Treenode> </ treenodes></p>
<p>You May Run The TreeView Example Program.</p>
<p>Next we will look at the ToolBar control. Although it also has a limited number of properties and methods, you can do some useful things with it. The example program demonstrates two ways to handle events with the ToolBar control. The first example checks the button click event to change the fore color of a label control. The second example implements a horizontal menuing system. All in all I found the toolbar to have some useful features although it also is short on properties and methods.</p>
<p><% @ Register TagPrefix = "iewc" Namespace = "Microsoft.Web.UI.WebControls" Assembly = "Microsoft.Web.UI.WebControls, Version = 1.0.2.226, Culture = neutral, PublicKeyToken = 31bf3856ad364e35"%> <% @ Page language = "VB"%> <! DocType html public "- // w3c // DTD HTML 4.0 Transitional // en"> <html> <head> <title> Toolbar </ title> <script runat = "server" > Sub btn_Click (sender As Object, e As EventArgs) Select Case btnGroup.SelectedCheckButton.Text Case "Red" lblMessage.ForeColor = System.Drawing.Color.Red Case "Green" lblMessage.ForeColor = System.Drawing.Color.Green Case "Blue" lblMessage.ForeColor = System.Drawing.Color.Blue End SelectEnd SubSub Button_Click (sender As Object, e As EventArgs) Select Case sender.id.ToString () Case "books" Response.Redirect ( "http: // www .dotNetjohn.com / books.aspx ") case" http://www.dotjet.com/links.aspx ") case" home "response.redirect (" http://www.dotjetjohn .com / ") Case" About "response.redirect (" htt P: //www.dotnetjohn.com/about.aspx ") End SelectenD Sub </ script> <meta name =" generator "content =" Microsoft Visual Studio.Net 7.0> <meta name = "code_language" content = " Visual Basic 7.0 "> <meta name = vs_defaultClientScript content =" JavaScript "> <meta name = vs_targetSchema content =" http://schemas.microsoft.com/intellisense/ie5 "> </ head> <body> <form id = "Form1" method = "post"</p>
<p>runat = "server"> Simple Toolbar with Events <iewc: Toolbar id = "Toolbar1" runat = "server" width = "100px" AutoPostBack = "True" OnButtonClick = "btn_Click"> <iewc: ToolbarCheckGroup id = "btnGroup"> <iewc: ToolBarCheckButton Text = "Red" /> <iewc: ToolBarCheckButton Text = "Blue" /> <iewc: ToolBarCheckButton Text = "Green" /> </ iewc: ToolbarCheckGroup> </ iewc: Toolbar> <p> <asp : Label id = "lblMessage" runat = "server" text = "this is your color" /> </ p> <div align = "center> Toolbar as a navigation menu <iewc: Toolbar id =" Toolbar2 "Runat =" server "onButtonClick =" Button_Click "width =" 225px "> <iewc: ToolbarSeparator /> <iewc: ToolbarButton text =" Books "id =" books "/> <iewc: ToolbarSeparator /> <iewc: ToolbarButton text =" Links " ID = "links" /> <iewc: Toolbarseparator /> <iewc: ToolbarButton text = "home" id = "home" /> <iewc: ToolbarSeparator /> <iewc: ToolbarButton text = "about" id = "about" / > <IEWC: ToolbarseParetor /> </ iewc: Toolbar> </ div> </ form> </ body> </ html> You May Run The Toolbar Example Program.</p>
<p>Lastly we will look at the TabStrip control. I found this control to be very frustrating to set up and to have limited usefulness. I present my efforts below and hope that you can do better. Please note that to get anything other than the tab strips THEMSELVES (The Headings) You Must Also Include A Multipage Control.</p>
<p><% @ Register TagPrefix = "iewc" Namespace = "Microsoft.Web.UI.WebControls" Assembly = "Microsoft.Web.UI.WebControls, Version = 1.0.2.226, Culture = neutral, PublicKeyToken = 31bf3856ad364e35"%> <! DOCTYPE HTML PUBLIC "- // w3c // DTD HTML 4.0 Transitional // En"> <html> <head> <title> tabstrip </ title> <meta name = "generator" content = "Microsoft Visual Studio.net 7.0"> <meta name = "CODE_LANGUAGE" content = "Visual Basic 7.0"> <meta name = vs_defaultClientScript content = "JavaScript"> <meta name = vs_targetSchema content = "http://schemas.microsoft.com/intellisense/ie5"> < / head> <body> <form id = "form1" method = "post" runat = "server"> <iewc: tabstrip id = tabstrip2 runat = "server" style = "Width: 400px; height: 100%;" TabSelectedStyle = "background-color: #ffffff; color: # 000000" TabHoverStyle = "background-color: # 777777" SepDefaultStyle = "width: 10px; border-bottom: solid 1px red;" TabDefaultStyle = "background-color: # 000000; Border: Solid 1PX Red; Font-Family: Verdana; Font-Weight: bold; font-size: 8pt; Color: #ffff; width: 7 9; TEXT-align: center "targetid =" mpctabs "> <iewc: tab text =" tab 1 "/> <iewc: TabseParetor /> <iewc: tab text =" tab 2 "/> <iewc : Tabseparator /> <iewc: tab text = "tab 3" /> </ iewc: tabstrip> <iewc: multipage id = "mpctabs" runat = "style =" border-right: red 1px solid;</p>
<p>Padding-right: 12px; border-top: medium none; padding-limited: 12px; border-left: red 1px solid; padding-top: 12px; border-bottom: red 1px solid "width =" 400px "Height =" 81px "> <iewc: PageView> MultiPage One </ iewc: PageView> <iewc: PageView> MultiPage Two </ iewc: PageView> <iewc: PageView> MultiPage Three </ iewc: PageView> </ iewc : Multipage> </ form> </ body> </ html> You May Run The Tabstrip Example Program Here.</p>
<p>At the top of the article I posed the question: are these IEWebControls ready for prime time For me, the answer is no While Microsoft is to be lauded for making the controls available, I believe they need a lot more work to make them?. truly useful on the web. They are simply not "fat" enough to be included with the rest of the .Net server controls. The one possible exception may lie in using the TreeView and ToolBar controls for page navigation.</p>
<p>You May Download The Code Here. Don't forget That Before You Can Run The Programs You Must Download The Controls At The Link Provided At The Top of The Article.</p></div><div class="text-center mt-3 text-grey">
转载请注明原文地址:https://www.9cbs.com/read-110025.html</div><div class="plugin d-flex justify-content-center mt-3"></div><hr><div class="row"><div class="col-lg-12 text-muted mt-2"><i class="icon-tags mr-2"></i><span class="badge border border-secondary mr-2"><h2 class="h6 mb-0 small"><a class="text-secondary" href="tag-2.html">9cbs</a></h2></span></div></div></div></div><div class="card card-postlist border-white shadow"><div class="card-body"><div class="card-title"><div class="d-flex justify-content-between"><div><b>New Post</b>(<span class="posts">0</span>)
</div><div></div></div></div><ul class="postlist list-unstyled">
</ul></div></div><div class="d-none threadlist"><input type="checkbox" name="modtid" value="110025" checked /></div></div></div></div></div><footer class="text-muted small bg-dark py-4 mt-3" id="footer"><div class="container"><div class="row"><div class="col">CopyRight © 2020 All Rights Reserved
</div><div class="col text-right">Processed:
<b>0.040</b>, SQL:
<b>9</b></div></div></div></footer><script src="./lang/en-us/lang.js?2.2.0"></script><script src="view/js/jquery.min.js?2.2.0"></script><script src="view/js/popper.min.js?2.2.0"></script><script src="view/js/bootstrap.min.js?2.2.0"></script><script src="view/js/xiuno.js?2.2.0"></script><script src="view/js/bootstrap-plugin.js?2.2.0"></script><script src="view/js/async.min.js?2.2.0"></script><script src="view/js/form.js?2.2.0"></script><script>
var debug = DEBUG = 0;
var url_rewrite_on = 1;
var url_path = './';
var forumarr = {"1":"Tech"};
var fid = 1;
var uid = 0;
var gid = 0;
xn.options.water_image_url = 'view/img/water-small.png';
</script><script src="view/js/wellcms.js?2.2.0"></script><a class="scroll-to-top rounded" href="javascript:void(0);"><i class="icon-angle-up"></i></a><a class="scroll-to-bottom rounded" href="javascript:void(0);" style="display: inline;"><i class="icon-angle-down"></i></a></body></html><script>
var forum_url = 'list-1.html';
var safe_token = '8gGnZmC8pbTUoI7avrOtEvfPskOZQNdIr2s7spOevMwlrkSxkuH5YjimLGDHBNjyFE72y6ycWpRLvvWiQGp26g_3D_3D';
var body = $('body');
body.on('submit', '#form', function() {
var jthis = $(this);
var jsubmit = jthis.find('#submit');
jthis.reset();
jsubmit.button('loading');
var postdata = jthis.serializeObject();
$.xpost(jthis.attr('action'), postdata, function(code, message) {
if(code == 0) {
location.reload();
} else {
$.alert(message);
jsubmit.button('reset');
}
});
return false;
});
function resize_image() {
var jmessagelist = $('div.message');
var first_width = jmessagelist.width();
jmessagelist.each(function() {
var jdiv = $(this);
var maxwidth = jdiv.attr('isfirst') ? first_width : jdiv.width();
var jmessage_width = Math.min(jdiv.width(), maxwidth);
jdiv.find('img, embed, iframe, video').each(function() {
var jimg = $(this);
var img_width = this.org_width;
var img_height = this.org_height;
if(!img_width) {
var img_width = jimg.attr('width');
var img_height = jimg.attr('height');
this.org_width = img_width;
this.org_height = img_height;
}
if(img_width > jmessage_width) {
if(this.tagName == 'IMG') {
jimg.width(jmessage_width);
jimg.css('height', 'auto');
jimg.css('cursor', 'pointer');
jimg.on('click', function() {
});
} else {
jimg.width(jmessage_width);
var height = (img_height / img_width) * jimg.width();
jimg.height(height);
}
}
});
});
}
function resize_table() {
$('div.message').each(function() {
var jdiv = $(this);
jdiv.find('table').addClass('table').wrap('<div class="table-responsive"></div>');
});
}
$(function() {
resize_image();
resize_table();
$(window).on('resize', resize_image);
});
var jmessage = $('#message');
jmessage.on('focus', function() {if(jmessage.t) { clearTimeout(jmessage.t); jmessage.t = null; } jmessage.css('height', '6rem'); });
jmessage.on('blur', function() {jmessage.t = setTimeout(function() { jmessage.css('height', '2.5rem');}, 1000); });
$('#nav li[data-active="fid-1"]').addClass('active');
</script>
