I downloaded examples on this website and learned about the menu control and toolbar components.
// Put the following javascript code in mytest. and put it together with your webpage file. net, which can be aspx, html, AND htm. If it is java, it can be put together with jsp, html, and htm.
Function MainFormJS (){
// Create the menu
Var prjmenu = new Ext. menu. Menu ();
Prjmenu. add (
{Text: 'New Project', handler: newProject },
{Text: 'Open project '},
{Text: 'close project '}
);
// Create the menu
Var dbsmenu = new Ext. menu. Menu ();
Dbsmenu. add (
{Text: 'Open schema '},
{Text: 'generate data entity '},
{Text: 'Design querys '}
);
// Create the menu
Var uimenu = new Ext. menu. Menu ();
Uimenu. add (
{Text: 'Design UIS '}
);
Var tb = new Ext. Toolbar ('toolbar ');
Tb. add (
{Text: 'project', menu: prjmenu },
{Text: 'database', menu: dbsmenu },
{Text: 'ui', menu: uimenu}
);
Function newProject ()
{
Alert ("New project clicked ");
}
}
Ext. onReady (MainFormJS );
Program annotation: The menu Control must be bundled with other controls to be displayed. This example is bundled with the toolbar.
Event handler: newProject is the event processing function of the New project menu item.
In Your webpage files (such as aspx, html, htm, jsp, and other files)
Add the following statements:
<Link rel = "stylesheet" type = "text/css" href = "css/ext-all.css"/>
<Script language = "javascript" src = "ext-base.js" type = "text/javascript"> </script>
<Script language = "javascript" src = "ext-all-debug.js" type = "text/javascript"> </script>
<Script language = "javascript" src = "mytest. js" type = "text/javascript"> </script>
In the body section, you must have the following div as the host to work with the above javascript program:
<Div id = "toolbar"> </div>
<Div id = "treepanel"> </div>
<Div id = "hello-dlg">
</Div>
A complete aspx file is as follows:
<% @ Page Language = "C #" AutoEventWireup = "true" CodeFile = "MainForm. aspx. cs" Inherits = "MainForm" %>
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head runat = "server">
<Title> www.jing-tech.net jing-tech studio painter tools </title>
<Link rel = "stylesheet" type = "text/css" href = "css/ext-all.css"/>
<Script language = "javascript" src = "ext-base.js" type = "text/javascript"> </script>
<Script language = "javascript" src = "ext-all-debug.js" type = "text/javascript"> </script>
<Script language = "javascript" src = "mytest. js" type = "text/javascript"> </script>
</Head>
<Body>
<Div id = "toolbar"> </div>
</Div>
<Form id = "form1" runat = "server">
& Nbsp;
</Form>
</Body>
</Html>
The effect after running is as follows:
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
