Épület egy fa kategóriák javascript, php és mysql, webdevkin
Mit fogunk csinálni, és mi volt az eredmény?
Hogy könnyebb, hogy hogyan kell építeni egy hierarchia, hozzon létre egy táblázatot mysql és a hajtás egyes vizsgálati adatok. Az alábbi SQL-kódot egyaránt. adatbázis megszokásból hívjuk webdevkin.
vizsgálati adatok
Most nézd meg a táblázatot a szokásos kategóriákban phpMyAdmin-e vagy dbForgeStudio és meg kell kezdeni a mini-alkalmazás.
A szerkezet a projekt
Js mappa részben a régi memória gyártó, és a modulok. Az első helyen fog jQuery könyvtár és jstree. Tisztázása - jquery szükség, nem csak nekünk, hanem a függőséget jstree. A modulok mappa main.js libasorban - a fő js-script alkalmazások. A mappában php Levél index.php, ami a szerver az összes munkát.
A szerver kód - index.php
Sorolja egyszerű, és a végrehajtását semmilyen problémát nem lehet. A fájl elején akkor nyilvánítja a szükséges állandók az adatbázis-kapcsolat.
Akkor írj egy függvény csatlakozni az adatbázishoz mysqli.
A szerver oldalon a mi alkalmazás minden, megyünk az ügyfélnek.
A jelölés a katalógus oldal - index.html
A test is naiv listájában.
És adjunk hozzá néhány jelölést, hogy main.css
A HTML / CSS befejeződött, és most megy a legérdekesebb - javasctipt-kódfában jön létre. Ez az, ahol összegyűlünk mind megfogant funkciót.
main.js - inicializálása alkalmazása
Alkalmazzuk itt: hozzon létre egy js-modul alapján a lezárás, zakeshiruem szükséges elem dom, írjon több magán- és egy nyilvános módszer - alkalmazása inicializálási eljárást.
modul keret
Az adatokat a szerver - _loadData () metódus
Épület egy fa _initTree funkciót használjuk jstree
És ez minden, amire szüksége van! Vizuálisan úgy néz ki, a legnehezebb része az alkalmazás felháborítóan egyszerű. Szüksége van egy bizonyos eleme a dom csak alkalmazni a módszert jstree néhány paramétert. Ebben az esetben, átadjuk az aktuális adatokat az adatok több: false jelzi, hogy nem kell több kiválasztás és check_callback: true azt jelzi, hogy meg akarjuk változtatni, miután a fa valami mást, és nem.