extmvc+thinkphp Development of CRM management system--the implementation of navigation tree

Recently very depressed, for unknown reasons the development of the background management program can not be accessed. Imitate the other heroes to your navigation tree (EXTJSMVC) to me there is no effect. Even in a fury to delete their own write a week code sample, it is not good luck this month, do not complain (haha!). Just give yourself a recent blog to find an excuse for not updating.

Get to the point today to share a complete case of accessing the MySQL database through the background, loading the foreground navigation tree.

Pre-Preparation:

2. Create MySQL database and corresponding table structure in background:

   mi_id                     Int (one)          

   Mi_menuname           &N Bsp   varchar      

   Mi_url                   varchar (

   Mi_parentnode             varchar (45) Span class= "Apple-tab-span" >

   Mi_groupname             varchar (+)

   Mi_stateid               INT (ten)

4. Create the following data:

   650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M02/22/87/wKiom1MgEQzDugsFAAFVIVCCVdc655.jpg "title=" Snap1.png "alt=" Wkiom1mgeqzdugsfaafvivccvdc655.jpg "/>

5. Front Directory Preparation:

   650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M02/22/88/wKioL1MgEWrSJ5nfAAHKLrxDK8A865.jpg "title=" Snap2.png "alt=" Wkiol1mgewrsj5nfaahklrxdk8a865.jpg "/>

   Where the contents of the Red box section are the files of the navigation tree to be demonstrated today.

   The preparation work is completed, and the following steps are gradually implemented by layer:

   First: Create the foreground of the HTML and JS page, here need to focus on the face, EXTJSMVC is characterized by the current page needs to be displayed in the initialization of the content to be imported locally, later to be triggered by the user to refer to the JS file, after the user triggered the relevant operation, only imported to the local. So a lot of EXTJSMVC's canonical structure, a bit like the. NET WinForm development Program.cs, each project has a master file that runs through the main file entry. However, in the actual project development, may face a variety of situations, so, the project case shown here, all is to use an HTML file to carry a JS file as the main file. At a certain level, with the help of ExtJS MVC, the foreground display control can be encapsulated into the corresponding view, and then in use, the related reuse can be made. Gossip to this realization begins.

   Front Desk HTML page code: index_menutree.html

   <! Doctype>

Note here that the Extmvcpath is configured via the thinkphp config configuration file:

' __extmvcpath__ ' =>__root__. ' /app/tpl/default/'. Group_name. ' /js ',

Front desk js file: Index_menutree

Ext.Loader.setConfig ({    enabled:true}); Ext.application ({    requires:[' Ext.container.Viewport '],    name: ' MVC ',     appfolder:extmvcpath,    controllers:[' Index_menuTreeController ' ],    launch:function () {        ext.create (' Ext.container.Viewport ', {            layout: ' fit ',             items:[                    {                          xtype: ' Panel ',                         title: ' DeMo panel '                      }                     ]        });     }});

To get an effect first:

650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M00/22/88/wKioL1MgG8vQumN7AAEq5JfYIpw638.jpg "title=" Snap3.png "alt=" Wkiol1mgg8vqumn7aaeq5jfyipw638.jpg "/>

The revolution has not been successful comrade still need to work hard, next to create the corresponding view file, the directory structure is as follows:

650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M02/22/89/wKioL1MgHGTDZaXIAAA6nHLtJBU053.jpg "title=" Snap4.png "alt=" Wkiol1mghgtdzaxiaaa6nhltjbu053.jpg "/>

Ext.define (' MVC.view.main.menuTree ', {    extend: ' Ext.tree.Panel ',     Alias: ' Widget.mainmenutree ',     border:false,    //hreftarget: ' MainContent ',    rootvisible:false,                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                &Nbsp;   store: ' Menustore '}); 

Menustore.js This file should be taken care of!

Ext.define (' MVC.store.menuStore ', {extend: ' Ext.data.TreeStore ', alias: ' Widget.menustore ',//storeid: ' Menustoreid ' , Defaultroodid: ' Root ',//requires:[' MVC.model.menuModel '],//model:[' MVC.model.menuModel ', proxy:{ty PE: ' ajax ', url:extmvcpath+ '/json/menujson.json ', Reader: ' JSON ', Autoload:true}});

Menujson.js file

[    {"id": "2",     "pid": "1",     "text": "User Management",      "leaf": "0",     "url": "Http:\/\/www.lihuai.net",      "Children":[{         "id": "5",          "pid": "2",         "text": "Basic Information",          "Leaf": "1",         "url": "http:\/\/ Www.sogou.com ",        " Children ":" "},{          "id": "One",         "pid": "2",          "text": "Information Management",         "leaf": "1",          "url": "Http:\/\/www.sogou.com",          "Children": "},{         "id": ",        " "pid": "2",          "text": "Add User",         "Leaf": "1",         "url": "Http:\/\/www.sogou.com",          "Children": "}]},    {" id ":" 3 ",    " pid " : "1",     "text": "Product Management",     "leaf": "0",     "url": " Http:\/\/www.so.com ",    " Children ":[{        " id " : "7",         "pid": "3",          "text": "Product Information",         "leaf": "1",          "url": "Http:\/\/www.so.com",         "Children": ""},{          "id": "8",         "pid": "3",          "text": "Product Add",         "leaf": "1",          "url": "Http:\/\/www.so.com",          "Children": ""}]}]

The last legendary controller file was unveiled; index_menutreecontroller.js

Ext.define (' MVC.controller.Index_menuTreeController ', {    extend: ' Ext.app.Controller ',     views:[' main.menutree '],    models:[' MenuModel '],     stores:[' Menustore '],    init:function () {         this.control ({                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                });     });

Upper effect: 650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M02/22/8B/wKiom1MgH67w52luAAGNvZrDSPY730.jpg "title=" Snap5.png "alt=" Wkiom1mgh67w52luaagnvzrdspy730.jpg "/>

The next step is to get the data for the response in conjunction with the thinkphp Access database:

This article is from "The growth of Luo shan black tea" blog, please be sure to keep this source http://85608547.blog.51cto.com/2093443/1532697