Ext4js homepage layout, Dynamic assignment menu, and click the url to display in the content panel

Ext4js homepage layout, Dynamic assignment menu, and click the url to display in the content panel

Ext4js homepage layout, Dynamic assignment menu, and click the url to display in the content panel

The database is not used here. It is easy to imitate with js,

When I watch videos on the Internet, his grandmother's video is of relatively low version. The same code is an error. When I check the API, the internal database is different, and the individual is killed.

I am still charged for the higher version of Lao Tzu. In this year, I still have to rely on my own research and finally come up with a simple one. Let's share it .....

 Insert title here
 <script type="text/javascript" src="fornt/js/ext4/ext-all.js"></script>
 <script type="text/javascript" src="fornt/js/comm/comm.js"></script><script type="text/javascript" src="index.js"></script>

// Response //-js on the home page // response Ext. onReady (function () {// Ext. BLANK_IMAGE_URL = "fornt/js/ext4/resources/images/default/s.gif"; // prevent display of the decoration icon Ext defined in the css file. quickTips. init (); // enables html tags with the data-qtip attribute to display the content when you move the cursor up. This function is similar to the title function of HTML tags. Ext. form. field. prototype. msgTaarget = "qtip"; // msgTarget: contains four methods: qtip, title, under, sideinitLayout () ;}); function initLayout () {// example // auxiliary js // example // Tree node storevar main_ext_treeStore = Ext. create ('ext. data. treestore', {root: {expanded: true, children: [{text: "grid demo", expanded: true, children: [{text: 'grid demo', leaf: true}] },{ text: "homework", expanded: true, children: [{text: "user list", leaf: true, listeners: {// listener click Event: function (node, e) {alert ('dd'); // var v_main_center = // Ext. getCmp ('_ main_center_id'); // var ObjPanel = new index_grid_user (); // v_main_center.add ("xxxx") ;},{ id: "testFnsddd", text: "alegrbra", leaf: true, listeners: {"click": function () {alert ('dd') ;}}] }, {text: "buy lottery tickets", leaf: true}]});/** {title: '<% = higherRm. getName () %> ', html: "<% = a_html %>", iconCls: * 'nav' // see the HEAD section for style used} */var itemObj1 = new Object (); itemObj1.title = "seller management"; var html_menu _ = "item management"
Merchant Information Management
Xx management
"Export itemobj1.html = html_menu _; itemObj1.iconCls =" nav "; var sysMeun = new Object (); sysMeun. title =" System Management "; // getProPathvar html_menu_user _ =" User Management"
"+" Role management
"+" Permission management
"Define sysmeun.html = html_menu_user _; sysMeun. iconCls = "nav"; var itemss = new Array (); itemss [0] = sysMeun; itemss [1] = itemObj1; // itemss. push (itemObj1); // itemss. push (itemObj2); // homepage layout // adjust var viewportObj = new Ext. viewport ({title: "Sys-system management", layout: 'border', items: [{title: 'sys-RBAC management system', region: 'north', // position for region. above xtype: 'panel ', height: 100, split: true, // enable resizingmargins: '0 5 5 5', html: "<=== welcome to the SYS-RBAC Management System ===>"}, {title: 'latest dynamic ', region: 'south', // position for region. southern xtype: 'panel ', height: 100, split: true, // enable resizingmargins: '0 5 5 5'}, {// xtype: 'panel 'Imp Lied by defaulttitle: 'menu list', region: 'west', // west xtype: 'panel ', margins: '5 0 0 5', width: 200, collapsible: true, // make collapsibleid: 'West-region-iner ', ults: {bodyStyle: 'padding: 15px'}, layout: {type: 'accordion', titleCollapse: true, // click animate: true, activeOnTop: true}, items: itemss, listeners: {'itemclick': function (view, record) {alert ("dd "); // var v_main_center = E Xt. getCmp ('_ main_center_id'); // var ObjPanel = new index_grid_user (); // alert ("dd "); // v_main_center.add ("---- === jjjjj") ;}}, {id: "_ main_center_id", title: 'content Center', region: 'center ', // center region is required, no width/height // specifiedxtype: 'panel ', layout: 'fit', margins: '5 5 0 0'}] //, renderTo: ext. getBody ()});}; // ==================================== content panel ================== ======================/// add an operation surface through the menu Function mainClickMenuFn (url) {url = getProPath () + url; //, menuFormIdvar addTabPanel = Ext. getCmp ("_ main_center_id"); addTabPanel. removeAll (); addTabPanel. add ({// title: "dd", // iconCls: 'tabs', id: tt, forceFit: // true, autoWidth: true, html: '<iframe frameBorder = 0 id = "main_content_frame" name = "main_content_frame" src = "' + url + '" width = "100%" height = "100%" scrolling = "no"> </iframe> ', // clos Able: true}). show ();/** var addTabPanel = mainTabs. getComponent (tt); if (! AddTabPanel) {mainTabs *. add ({title: tt, // iconCls: 'tabs', id: tt, forceFit: true, * autoWidth: true, html: '<iframe frameBorder = 0 id = "body_content_frame" * name = "body_content_frame" src = "' + url + '" width = "100%" height = "100%" * scrolling =" no "> </iframe> ', closable: true }). show ();} else {* mainTabs. setActiveTab (addTabPanel);} */};/** listeners: {// listener click Event: function (node, e) {v_main_center = * Ext. getCmp ('_ main_center_id'); var ObjPanel = new index_grid_user (); * v_main_center.add (ObjPanel );}}*/

Comm. js

function getProPath(){return "/sys-html/";}