You are on page 1of 41

Ti li u h ng d n xy d ng component trong Joomla! 1.

TI LI U H NG D N XY D NG COMPONENT TRONG JOOMLA! 1.5


Th c hi n b i on Thanh Tm (email: tamdt_a9tth@yahoo.com)
[Ng i d ch] Ti li u ny bao g m 4 ph n h ng d n b n t ng b c xy d ng m t component trong joomla 1.5. Ph n sau s b sung thm cc c i m m i vo ph n tr c hon thi n d n component c a b n. Khi k t thc m i ph n b n u c th ci t ngay cc v d th y c cc k t qu c a ph n . Ti li u h ng d n ny c d ch ch y u t trang web: http://dev.joomla.org/component/option,com_jd-wiki/Itemid,/id,tutorials:components/ Tuy nhin, y khng ph i l b n d ch hon thi n, c m t s o n ch d ch theo , c m t s o n d ch hi chu i do ti li u ny ch mang tnh ch t tham kh o. N u b n mu n c thm thng tin chi ti t v chnh xc xin vui lng xem b n g c ti ng Anh trn cc trang web tng ng) [Ng i d ch]

M t component l m t trong nh ng thnh ph n m r ng l n nh t v ph c t p nh t. Cc component c th xem nh cc ng d ng mini. M t cch tr c quan chng ta c th hnh dung joomla l m t h i u hnh v t t c cc component l cc ng d ng desktop. M i trang (page) trong joomla s g i n m t component t i v cc n i dung chnh (page body) c a trang . V d component n i dung (com_content) l m t ng d ng mini x l t t c cc v n v n i dung c tr l i, tng t nh th component ng k l m t ng d ng mini nh m x l vi c ng k c a ng i dng. M t componet c hai ph n chnh: ph n qu n tr v ph n trn site. Ph n trn site l ph n c s d ng t i v cc trang khi c tri u g i trong qu trnh v n hnh site thng th ng. Ph n qu n tr cung c p giao di n c u hnh, qu n l cc kha c nh khc nhau c a component v c truy c p thng qua ng d ng qu n tr c a joomla. Ph n h ng d n d i y s cung c p cho cc b n m t vi v d h u ch gip b n lm th no t o ra m t component. While we have gone to great lengths to make Joomla easy for content providers to use, we have equally spent a lot of time developing a flexible framework for developers to extend the capabilities of Joomla without having to touch the Core code.

How-To's (ph n b n d ch c a MVC 1-4 pha d i)


Hello World MVC 1 Component - The frame Hello World MVC 2 Component - The model Hello World MVC 3 Component - The table Hello World MVC 4 Component - The admin interface

Copyleft by on Thanh Tm

Trang 1/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

PH N 1. PHT TRI N M T COMPONENT MVC.


(Ph n h ng d n ny c d ch t trang web: http://dev.joomla.org/component/option,com_jd-wiki/Itemid,/id,components:hello_world_mvc1/).

1. Gi i thi u
Frameword m i trong joomla 1.5 mang l i nh ng thu n l i r t l n cho cc nh pht tri n. Cc o n code hon ton c ki m tra v kh r rng. Bi h ng d n ny s gip b n i qua cc b c trong qu trnh pht tri n nh m t o ra m t component c th s d ng frameword m i ny. Ph m vi c a bi ny l pht tri n m t component Hello World n gi n. Trong cc bi h ng d n ti p theo, frameword n gi n ny s c b sung, th hi n m t cch y kh nng v tnh linh ho t c a m u thi t k MVC trong joomla.

2. Yu c u
B n c n c joomla 1.5 ho c cc phin b n m i hn th c hnh bi h ng d n ny.

3. Gi i thi u v MVC (Model-View-Controler)


Trong khi t ng pha sau m t component d ng nh l kh n gi n th, cc o n code c th nhanh chng tr ln r t ph c t p khi cc c i m b sung c thm vo ho c giao di n c ty bi n. Model-View-Controler (g i t t l MVC) l m t m u thi t k ph n m m c dng t ch c cc o n m theo cch m vi c x l d li u (business logic) v vi c bi u di n d li u l tch r i nhau. Ti n n m sau h ng ti p c n ny l n u bussiness logic c nhm vo trong m t section th giao di n v tng tc ng i dng bao quanh d li u c th nh d ng v ty bi n l i m khng c nh h ng n vi c ph i l p trnh l i bussiness logic. (ngha l hnh th c v n i dung l tch r i nhau, do khi thay i hnh th c th hi n th khng nh h ng n n i dung). C ba ph n chnh trong m t MVC component (ba ph n ny bao g m Model, View v Controler). Chng c m t m t cch v n t t d i y. N u b n c n nhi u thng tin y hn xin vui lng tham kh o thm trong cc ng d n c cung c p cu i bi h ng d n ny.

3.1. Model
M t model l thnh ph n c a component ng gi d li u c a ng d ng. N th ng cung c p cc th t c qu n l v thao tc d li u ny theo m t cch no , trong c b sung thm cc th t c l y d li u t model. Trong tr ng h p c a chng ta model s ch a cc phng th c nh b sung, lo i b v c p nh t thng tin v nh ng l i cho m ng trong c s d li u. N cn ch a phng th c l y danh sch cc l i cho trong CSDL. Ni m t cch t ng qut, vi c truy c p vo CSDL l p d i s c ng gi trong model. Theo cch ny, n u m t ng d ng chuy n i sang vi c s d ng m t file bnh th ng lu tr thng tin c a n thay v s d ng CSDL, th ch c thnh ph n model l thay i, cc thnh ph n view v controler l khng i.

3.2. View

Copyleft by on Thanh Tm

Trang 2/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5 View l m t thnh ph n c a component c s d ng tr l i d li u t model theo cch ph h p v i tng tc. i v i cc ng d ng web, view thng th ng l cc trang HTML tr l i d li u. View l y d li u t model (d li u ny c chuy n qua n t i controler). V a d li u vo trong template (d li u s hi n th v i ng i dng). View khng lm thay i d li u. N ch hi n th d li u l y t model.

3.3. Controler
Controler ch u trch nhi m ph n h i cc hnh ng c a ng i dng. Trong cc ng d ng web, m t hnh ng c a ng i dng thng th ng l m t yu c u t i trang. Controler s xc nh yu c u g c a ra b i ng i s d ng v ph n h i thch h p b ng vi c yu c u model tnh ton d li u ph h p v chuy n t model vo view. Controler khng th hi n d li u t model, n kch ho t cc phng th c trong model hi u ch nh d li u v sau chuy n t model sang view hi n th d li u.

4. Ci

t Joomla! MVC

Trong joomla m u MVC c th c hi n s d ng 3 l p: <classname>JModel</classname>, <classname>JView</classname> v <classname>JController</classname>. Thng tin chi ti t v cc l p ny vui lng xem trong ti li u h ng d n API ((WIP).

5. T o m t component
i v i component c s c a chng ta, chng ta ch c n 5 file: hello.php - y l i m vo cho component c a chng ta (this is the entry point to our component) controller.php file ny c ch a controler c b n (this file contains our base controller) views/hello/view.html.php file ny nh n cc d li u c n thi t v t n ln template (this file retrieves the necessary data and pushes it into the template) views/hello/tmpl/default.php file ny l temple cho u ra (this is the template for our output) hello.xml y l m t file XML ni cho joomla bi t cch ci t component c a chng ta nh th no (this is an XML file that tells Joomla! how to install our component).

5.1. T o entry point


Joomla lun lun c truy c p thng qua m t i m vo n: index.php cho cc ng d ng site v administrator/index.php cho ng d ng qu n tr . Sau ng d ng s t i cc component c n thi t d a trn gi tr ch n l a trong URL ho c trong d li u POST. i v i component c a chng ta URL s nh sau: index.php?option=com_hello&view=hello. Vi c ny s t i file chnh c a chng ta v c th c xem nh m t i m vo n cho component c a chng ta: components/com_hello/hello.php. o n m ny th c s l c th ty theo cc component.
<?php

Copyleft by on Thanh Tm

Trang 3/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

/** * @package Joomla.Tutorials

* @subpackage Components * components/com_hello/hello.php * * @license */ // no direct access defined( '_JEXEC' ) or die( 'Restricted access' ); // Require the base controller require_once( JPATH_COMPONENT.DS.'controller.php' ); // Require specific controller if requested if($controller = JRequest::getWord('controller')) { $path = JPATH_COMPONENT.DS.'controllers'.DS.$controller.'.php'; if (file_exists($path)) { require_once $path; } else { $controller = ''; } } // Create the controller $classname $controller = 'HelloController'.$controller; = new $classname( ); @link GNU/GPL http://dev.joomla.org/component/option,com_jdwiki/Itemid,31/id,tutorials:modules/

// Perform the Request task $controller->execute( JRequest::getVar( 'task' ) ); // Redirect if set by the controller $controller->redirect(); ?>

Cu l nh u tin l cu l nh ki m tra b o m t. JPATH_COMPONENT l ng d n tuy t i t i component hi n t i, trong tr ng h p c a chng ta l components/com_hello. N u b n c n xc nh site component ho c s d ng JPATH_COMPONENT v admin component th b n c th JPATH_COMPONENT_ADMINISTRATOR. DS l d u phn cch th m c trong h th ng c a b n: c th l \ ho c /. i u ny c thi t l p t ng b i frameword, v th developer khng ph i quan tm n vi c pht tri n cc phin b n khc nhau cho cc h i u hnh khc nhau. DS s lun c s d ng khi tham chi u n cc file trn my ch c c b .

Copyleft by on Thanh Tm

Trang 4/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5 Sau khi t i controler c b n, chng ta s ki m tra m t controler c th c n n. Trong component ny, controler c b n ch l m t controler nhng chng ta c p n i u ny cho cc cng vi c trong tng lai. <classname>JRequest</classname>:getVar() tm m t bi n trong URL ho c POST d li u. B i v y n u URL c a chng ta l: index.php?option=com_hello>controller=controller_name th chng ta c th nh n c tn controler c a chng ta trong component b ng s d ng cu l nh sau: echo <classname>JRequest</classname>::getVar(controller); By gi chng ta c controler c s <classname>HelloController</classname> trong com_hello/controller.php, v n u c n thi t b sung thm cc controler d ng nh: <classname>HelloControllerController1</classname> trong com_hello/controllers/controller1.php. S s p x p theo h th ng ny s t o ra thu n l i v sau: {Componentname}{Controller}{Controllername}. Sau khi controler c t o ra, chng ta cho controler ch y nhi m v nh c ch ra trong URL: index.php?option=com_hello&task=sometask. N u khng c nhi m v no c thi t l p th nhi m v m c nh display s c gi nh. Khi display c s d ng, bi n view s quy t nh ci g s c hi n th . Cc nhi m v khc nh save, edit, new, Controler c th quy t nh redirect the page (th c hi n t i l i m t trang), thng th ng l sau khi m t nhi m v nh save c hon thnh. Cu l nh cu i cng th c hi n vi c ny. i m vo chnh (hello.php) v b n ch t thng qua vi c i u khi n controler th c hi n cc nhi m v c t ra trong request.

5.2. T o controler
Component c a chng ta ch c m t nhi m v - greet the world (th hi n l i cho). B i v y controler s r t n gi n. Khng c n n vi c tnh ton trn d li u. T t c nh ng g c n thi t ph i lm l t i view thch h p. Chng ta s ch c m t phng th c trong controler l display(). H u h t cc hm c n thi t c xy d ng trong l p JControler, b i v y t t c nh ng g chng ta c n l g i phng th c JControler::display(); Code c a controler c s nh sau:
<?php /** * @package * * @license */ // no direct access defined( '_JEXEC' ) or die( 'Restricted access' ); jimport('joomla.application.component.controller'); /** Joomla.Tutorials @link GNU/GPL http://dev.joomla.org/component/option,com_jd* @subpackage Components wiki/Itemid,31/id,tutorials:modules/

Copyleft by on Thanh Tm

Trang 5/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

* Hello World Component Controller * * @package Joomla.Tutorials

* @subpackage Components */ class HelloController extends JController { /** * Method to display the view * * @access */ function display() { parent::display(); } } ?> public

Vi c kh i t o c a <classname>JController</classname> s lun lun ng k m t nhi m v display() khi khng c nhi m v c th no c ch ra (b ng vi c s d ng phng th c registerDefaultTask()), n s c thi t l p nh m t nhi m v m c nh. Phng th c display() ny th t s khng c n thi t b i v t t c nh ng g n lm l g i hm kh i t o c a cha n. Tuy nhin, l m t c s kh t t ch ra i u g c n ph i lm trong controler. Phng th c <classname>JController</classname>::display() s xc nh view v layout t request, t i view v thi t l p layout. Khi b n t o ra m t menu item cho component c a b n, menu manager s cho php admin l a ch n view m h thch th hi n v trn layout c th . M t view thng th ng c xem nh m t cch hi n th c a m t t p cc d li u no (v d , danh sch cc car, danh sch cc event, m t car n, m t event n, ). M t layout l m t cch t ch c view. Trong component c a chng ta chng ta s c m t view n c g i l hello, v m t layout n (default).

5.3. T o view
Nhi m v c a view l r t n gi n: n nh n d li u c th hi n v t n ln template. D li u c t ln template s d ng phng th c <classname>JView</classname>::assignRef. o n m c a view nh sau:
<?php /**

Copyleft by on Thanh Tm

Trang 6/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

* @package *

Joomla.Tutorials @link http://dev.joomla.org/component/option,com_jd-

* @subpackage Components wiki/Itemid,31/id,tutorials:modules/ * @license */ // no direct access defined( '_JEXEC' ) or die( 'Restricted access' ); jimport( 'joomla.application.component.view'); /** * HTML View class for the HelloWorld Component * * @package */ class HelloViewHello extends JView { function display($tpl = null) { $greeting = "Hello World!"; $this->assignRef( 'greeting', $greeting ); parent::display($tpl); } } ?> HelloWorld GNU/GPL

5.4. T o template
Joomla template/ layout l cc file PHP thng th ng, c s d ng b tr, x p t d li u t view theo m t cch c th no . Cc bi n c gn b i phng th c JView::assignRef c th c truy c p t template s d ng $this{propertyname} (xem m template bn d i nh m t v d ). Template c a chng ta r t n gi n, chng ta ch mu n th hi n m t l i cho h p quy cch t view.
<?php // no direct access defined('_JEXEC') or die('Restricted access'); ?> <h1><?php echo $this->greeting; ?></h1>

5.5. ng gi t t c - T o ra file hello.xml


Copyleft by on Thanh Tm

Trang 7/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5 C th ci t th cng m t component b ng cch copy t t c cc file b ng FPT client v hi u ch nh CSDL. Nhng s hi u qu hn n u t o ra m t file c ng gi Joomla! Installer th c hi n i u ny cho b n. File ng gi ny s ch a nhi u d ng thng tin khc nhau nh: Cc miu t chi ti t c b n v component c a b n (v d nh tn), v ty m t s m t thng tin v b n quy n . M t danh sch cc file c n copy. M t file PHP th c hi n b sung cc thao tc ci t v g b (file ny l khng b t bu c). M t file SQL c ch a cc cu truy v n d li u m s c th c hi n vo lc ci t ho c g b (file ny l khng b t bu c). nh d ng c a file XML nh d i y:
<?xml version="1.0" encoding="utf-8"?> <!DOCTYPE install SYSTEM "http://dev.joomla.org/xml/1.5/componentinstall.dtd"> <install type="component" version="1.5.0"> <name>Hello</name> <!-The following elements are optional and free of formatting conttraints --> <creationDate>2007 02 22</creationDate> <author>John Doe</author> <authorEmail>john.doe@example.org</authorEmail> <authorUrl>http://www.example.org</authorUrl> <copyright>Copyright Info</copyright> <license>License Info</license> <!-The version string is recorded in the components table --> <version>Component Version String</version> <!-- The description is optional and defaults to the name --> <description>Description of the component ...</description> <!-- Site Main File Copy Section --> <!-- Note the folder attribute: This attribute describes the folder to copy FROM in the package to install therefore files copied in this section are copied from /site/ in the package --> <files folder="site"> <filename>index.html</filename> <filename>hello.php</filename> <filename>controller.php</filename> <filename>views/index.html</filename> <filename>views/hello/index.html</filename>

Copyleft by on Thanh Tm

Trang 8/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

<filename>views/hello/view.html.php</filename> <filename>views/hello/tmpl/index.html</filename> <filename>views/hello/tmpl/default.php</filename> </files>

<administration> <!-- Administration Menu Section --> <menu>Hello World!</menu> <!-- Administration Main File Copy Section --> <files folder="admin"> <filename>index.html</filename> <filename>admin.hello.php</filename> </files> </administration> </install>

N u b n xem xt file ny m t cch c n th n b n s nh n th y r ng c m t vi file s c copy m chng ta cha c p trn. Chng l cc file index.html. M t file ngn c n nh ng ng i dng t m trong vi c index.html c t trong m i th m c li t k m t danh sch th m c. N u khng c file index.html m t vi my ch web s li t k danh sch n i dung c a th m c. i u ny th ng gy r c r i. Cc file ny c m t dng n nh sau: (N n gi n l th hi n m t trang tr ng)
<html><body bgcolor="#FFFFFF"></body></html>

File khc l admin.hello.php, y l i m vo cho section qu n tr trong component c a chng ta. B i v chng ta cha c section qu n tr trong component vo th i i m ny nn n s c n i dung tng t nh file index.html.

6. Nh ng ng i vi t v

a ch download v d

Nh ng ng i tham gia vi t bi h ng d n ny: mjaz staalanden Component c th c download t i:

http://dev.joomla.org/components/com_jd-wiki/data/media/components/com_hello1.zip

Copyleft by on Thanh Tm

Trang 9/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

PH N 2. B

SUNG MODEL VO COMPONENT MVC.

(Ph n h ng d n ny c d ch t trang web: http://dev.joomla.org/component/option,com_jd-wiki/Itemid,/id,components:hello_world_mvc2/).

1. Gi i thi u
Trong bi h ng d n u tin ( ph n 1), chng ta m t vi c t o thnh m t component view-controler n gi n s d ng Joomla! Frameword. Trong bi u tin, l i cho m ng c code c nh vo trong view. i u ny khng tun theo m u MVC m t cch chnh xc b i v view ch c hi n th d li u ch khng ch a n. Trong ph n th hai ny, chng ta s m t lm th no chuy n d li u ra kh i view v a n vo m t model. Trong cc bi h ng d n ti p theo chng ta s m t kh nng v s m m d o m m u thi t k cung c p.

2. T o ra m t model
Khi ni m model c g i tn nh th b i v l p ny c mong i s m hnh ha cho m t vi th c th no . Trong tr ng h p c a chng ta, model u tin s a ra m t l i cho m ng. i u ny ph h p v i thi t k hi n t i, b i v chng ta c m t view hello, view th hi n m t cu cho m ng t i ng i dng. t tn cho cc model trong Joomla! Frameword l tn l p b t Cch thng th ng u b ng tn c a component (trong tr ng h p c a chng ta l hello), ti p theo l model, v cu i cng l l tn c a model. B i th l p model c a chng ta c g i l HelloModelHello. th i i m ny chng ta ch m hnh ha cch x l c a model hello, v n s tr l i m t l i cho. Chng ta s c m t phng th c c g i l getGreeting(). Phng th c ny n gi n l tr l i chu i Hello, World. D i y l code cho model c a chng ta:
<?php /** * Hello Model for Hello World Component * * @package * * @license */ // Check to ensure this file is included in Joomla! defined('_JEXEC') or die(); jimport( 'joomla.application.component.model' ); /** * Hello Model Joomla.Tutorials @link GNU/GPL http://dev.joomla.org/component/option,com_jd* @subpackage Components wiki/Itemid,31/id,tutorials:modules/

Copyleft by on Thanh Tm

Trang 10/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

* * @package */ class HelloModelHello extends JModel { /** * Gets the greeting * @return string The greeting to be displayed to the user */ function getGreeting() { return 'Hello, World!'; } } Joomla.Tutorials * @subpackage Components

Trong o n code trn, ch dng b t u l l nh jimport. Hm jimport c s d ng t i cc file t Joomla! frameword c n thi t cho component c a chng ta. C th cu l nh trn s t i file /libraries/joomla/application/component/model.php. Cc d u ch m . c s d ng nh cc d u phn cch th m c, v ph n cu i cng l tn file c n t i. T t c cc file c t i t th m c libraries. File trong tr ng h p trn c ch a nh ngha c a l p JModel, i u ny l c n thi t v l p c a chng ta c k th a t l p ny. By gi chng ta t o ra model c a mnh. Ti p theo chng ta s ph i hi u chnh view n c th l y c l i cho.

3. S d ng model
Joomla! Frameword c thi t l p theo cch controler s t ng t i model c tn trng v i view v t n vo trong view. V view c a chng ta c t l hello, nn model hello c a chng ta s t ng c t i v c t vo trong view. B i v y chng ta s d dng nh n c m t tham chi u n model c a chng ta s d ng phng th c JView::getModel(). o n m cho view tr c c a chng ta c ch a dng: $greeting = "Hello World!"; s d ng model, chng ta chuy n
$model =& $this->getModel(); $greeting = $model->getGreeting();

i dng trn thnh:

By gi , code c a view s nh sau:

Copyleft by on Thanh Tm

Trang 11/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

<?php /** * Hello View for Hello World Component * * @package * * @license */ // no direct access defined( '_JEXEC' ) or die( 'Restricted access' ); jimport( 'joomla.application.component.view'); /** * HTML View class for the HelloWorld Component * * @package */ class HelloViewHello extends JView { function display($tpl = null) { $model =& $this->getModel(); $greeting = $model->getGreeting(); $this->assignRef( 'greeting', $greeting ); parent::display($tpl); } } ?> Joomla.Tutorials * @subpackage Components Joomla.Tutorials @link GNU/GPL http://dev.joomla.org/component/option,com_jd* @subpackage Components wiki/Itemid,31/id,tutorials:modules/

4. B sung file vo package


T t c nh ng g cn l i c n ph i lm l b sung m t entry vo file XML model m i c a chng ta c copy. Joomla! Frameword s tm ki m model c a chng ta trong th m c models. B i v y entry cho file ny trng nh sau:
<filename>models/hello.php</filename>

File hello.xml m i c a chng ta s nh sau:


Copyleft by on Thanh Tm

Trang 12/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

<?xml version="1.0" encoding="utf-8"?> <!DOCTYPE install SYSTEM "http://dev.joomla.org/xml/1.5/componentinstall.dtd"> <install type="component" version="1.5.0"> <name>Hello</name> <!-- The following elements are optional and free of formatting conttraints --> <creationDate>2007 02 22</creationDate> <author>John Doe</author> <authorEmail>john.doe@example.org</authorEmail> <authorUrl>http://www.example.org</authorUrl> <copyright>Copyright Info</copyright> <license>License Info</license> <!-The version string is recorded in the components table --> <version>Component Version String</version> <!-- The description is optional and defaults to the name --> <description>Description of the component ...</description> <!-- Site Main File Copy Section --> <files folder="site"> <filename>index.html</filename> <filename>hello.php</filename> <filename>controller.php</filename> <filename>views/index.html</filename> <filename>views/hello/index.html</filename> <filename>views/hello/view.html.php</filename> <filename>views/hello/tmpl/index.html</filename> <filename>views/hello/tmpl/default.php</filename> <filename>models/index.html</filename> <filename>models/hello.php</filename> </files> <administration> <!-- Administration Menu Section --> <menu>Hello World!</menu> <!-- Administration Main File Copy Section --> <!-- Note the folder attribute: This attribute describes the folder

Copyleft by on Thanh Tm

Trang 13/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

to copied

copy

FROM

in

the

package

to

install

therefore

files

in this section are copied from /admin/ in the package --> <files folder="admin"> <!-- Site Main File Copy Section --> <filename>index.html</filename> <filename>admin.hello.php</filename> </files> </administration> </install>

5. K t lu n
Chng ta c m t component MVC n gi n. M i ph n t l r t n gi n vo th i i m ny, nhng n cung c p m t kh nng v s linh ho t r t l n.

6. Nh ng ng i vi t v

a ch download v d

Nh ng ng i tham gia vi t bi h ng d n ny: staalanden Component c th c download t i:

http://dev.joomla.org/components/com_jd-wiki/data/media/components/com_hello2.zip

Copyleft by on Thanh Tm

Trang 14/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

PH N 3. S

D NG CSDL TRONG COMPONENT MVC.

(Ph n h ng d n ny c d ch t trang web: http://dev.joomla.org/component/option,com_jd-wiki/Itemid,/id,components:hello_world_mvc3/).

1. Gi i thi u
Trong hai bi h ng d n u tin (ph n 1 v ph n 2) chng ti h ng d n cc b n lm th no xy d ng m t component MVC n gi n. Chng ta c m t view l y d li u t model (trong bi h ng d n th 2). Trong bi ny chng ta s lm vi c v i model. Thay v vi c d li u c code tr c ti p trong model, th model s l y d li u t m t b ng trong CSDL.

2. L y d li u
Model hi n t i c a chng ta c m t phng th c getGreeting(). Phng th c ny r t n gi n, t t c nh ng g n lm l tr v m t cu cho c code c nh. lm nh ng i u ny th v hn, chng ta s l y cu cho t b ng c s d li u. Trong ph n sau, chng ta s m t lm cch no t o ra m t file SQL v b sung cc o n m ph h p vo file XML t o ra b ng v b sung d li u m u vo b ng khi component c ci t. By gi , chng ta ch n gi n thay th cu l nh tr v trong hm getGreeting b ng o n code l y l i cho m ng t CSDL v tr l i l i cho m ng . u tin, chng ta c n l y c m t tham chi u n i t ng CSDL. V joomla s d ng CSDL cho cc thao tc thng th ng c a n, nn n c m t k t n i t i CSDL t n t i, b i th khng c n thi t ph i t o ra m t k t n i CSDL ring. C th l y c m t tham chi u t i k t n i b ng cch s d ng cu l nh:
$db =& JFactory::getDBO();

JFactory l m t l p static c s d ng nh n tham chi u n nhi u i t ng h th ng khc nhau. Cc thng tin thm v l p ny c th tham kh o trong ti li u v API. Tn hm getDBO l vi t t t cho get DataBase Object, c th nh m t cch d dng v r t quan tr ng. By gi chng ta c m t tham chi u n i t ng CSDL, Chng ta c th l y d li u. i u ny c th c qua hai b c: Lu tr cu truy v n c a vo i t ng CSDL T i k t qu v Code c a phng th c getGreeting() by gi s nh sau:
function getGreeting() { $db =& JFactory::getDBO(); $query = 'SELECT greeting FROM #__hello'; $db->setQuery( $query );

Copyleft by on Thanh Tm

Trang 15/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

$greeting = $db->loadResult(); return $greeting; }

Trong o n m trn hello l tn c a b ng trong CSDL m chng ta s t o ra trong ph n sau. V greeting l tn c a tr ng lu tr cu cho m ng. N u b n cha quen v i SQL, s r t h u ch n u b n l y m t bi h ng d n xem xt l i. Nh ng bi h ng d n nh th b n c th tm th y w3schools. Phng th c $dbloadResult() s ch y cu l nh truy v n CSDL c lu tr v tr v tr ng u tin c a dng u tin trong k t qu . Xem JDatabase API reference c cc thng tin nhi u hn v cc phng th c khc trong l p JDatabase.

3. T o ra file SQL trong qu trnh ci

t v g b component

Joomla! installer c xy d ng s n vi c h tr i v i vi c ch y cc cu truy v n trong qu trnh ci t component. T t c cc cu truy v n ny c lu tr trong m t file text chu n. Chng ta s c 3 cu truy v n trong file ci t: vi c u tin s th c hi n xa b ng trong tr ng h p n t n t i, ti p theo th c hi n vi c t o ra b ng v i cc tr ng ph h p, v cu i cng l chn d li u vo b ng v a t o. D i y l cc cu truy v n c a chng ta:
DROP TABLE IF EXISTS `#__hello`; CREATE TABLE `#__hello` ( `id` int(11) NOT NULL auto_increment, `greeting` varchar(25) NOT NULL, PRIMARY KEY (`id`) ) ENGINE=MyISAM AUTO_INCREMENT DEFAULT CHARSET=utf8; INSERT INTO `#__hello` (`greeting`) VALUES ('Hello, World!'), ('Bonjour, Monde!'), ('Ciao, Mondo!');

B n c th th y ti n t trong cc tn b ng h i k c c. Tuy nhin, Joomla! s thay th cc ti n t ny b i ti n t c xc nh trong qu trnh ci t. i v i h u h t cc b n ci t, b ng ny s tr thnh jos_hello. i u ny cho php nhi u b n ci t joomla c th s d ng chung CSDL, v ngn ch n cc xung t v i cc ng d ng khc s d ng cng tn b ng (v d , hai ng d ng c th chia s chung m t CSDL, nhng c hai u c n m t b ng user, v i cch ny v n s c gi i quy t). Chng ta xc nh hai tr ng trong CSDL. Tr ng u tin l id ng vai tr l kha chnh. Kha chnh trong m t b ng c a CSDL l tr ng dng xc nh duy nh t Trang 16/41

Copyleft by on Thanh Tm

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5 m t b n ghi trong b ng. N th ng c s d ng tm ki m cc hng trong CSDL. Tr ng cn l i l greeting. y l tr ng lu cu cho m ng c tr l i b i truy v n m chng ta s d ng trn. Cc cu truy v n c a chng ta s c lu trong file install.utf.sql.

T o ra file SQL

g b ci

M c d chng ta lun mong mu n ng i dng s khng bao gi mu n g b component c a chng ta, tuy nhin c m t i u quan tr ng l n u h th c hi n vi c chng ta khng c l i b t c th g sau khi g b . Joomla! s qu n l vi c xa cc file v cc th m c c t o ra trong qu trnh ci t, nhng b n ph i b sung th cng cc cu truy v n s lo i b cc b ng c thm vo CSDL. Trong v d , chng ta ch t o m t b ng, nn chng ta ch c n m t cu truy v n xa n.
DROP TABLE IF EXISTS `#__hello`;

Cu truy v n ny s

c lu tr trong file uninstall.utf.sql.

4. C p nh t file ci

Chng ta c n ph i thay i m t vi th trong file ci t XML. u tin, chng ta c n b sung hai file m i vo danh sch cc file. File ci t SQL s ph i a vo trong th m c admin. Th hai, chng ta c n ph i bo cho trnh ci t ch y cc cu truy v n trong cc file c a chng ta trong qu trnh ci t v qu trnh g b . File XML m i c a chng ta s nh sau:
<?xml version="1.0" encoding="utf-8"?> <!DOCTYPE install SYSTEM "http://dev.joomla.org/xml/1.5/componentinstall.dtd"> <install type="component" version="1.5.0"> <name>Hello</name> <!-The following elements are optional and free of formatting conttraints --> <creationDate>2007 02 22</creationDate> <author>John Doe</author> <authorEmail>john.doe@example.org</authorEmail> <authorUrl>http://www.example.org</authorUrl> <copyright>Copyright Info</copyright> <license>License Info</license> <!-The version string is recorded in the components table --> <version>Component Version String</version> <!-- The description is optional and defaults to the name --> <description>Description of the component ...</description>

Copyleft by on Thanh Tm

Trang 17/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

<!-- Site Main File Copy Section --> <files folder="site"> <filename>index.html</filename> <filename>hello.php</filename> <filename>controller.php</filename> <filename>views/index.html</filename> <filename>views/hello/index.html</filename> <filename>views/hello/view.html.php</filename> <filename>views/hello/tmpl/index.html</filename> <filename>views/hello/tmpl/default.php</filename> <filename>models/hello.php</filename> </files> <install> <sql> <file charset="utf8" driver="mysql">install.sql</file> </sql> </install> <uninstall> <sql> <file charset="utf8" driver="mysql">uninstall.sql</file> </sql> </uninstall> <administration> <!-- Administration Menu Section --> <menu>Hello World!</menu> <!-- Administration Main File Copy Section --> <!-folder to copy FROM in the package to install therefore files copied in this section are copied from /admin/ in the package --> <files folder="admin"> <!-- Site Main File Copy Section --> <filename>index.html</filename> <filename>admin.hello.php</filename> <filename>install.sql</filename> <filename>uninstall.sql</filename> </files> </administration> Note the folder attribute: This attribute describes the

Copyleft by on Thanh Tm

Trang 18/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

</install>

Ch n hai thu c tnh xu t hi n trong cc th <file> n m trong cc ph n <install> v <uninstall>: charset v driver. Charset l ki u charset c s d ng. Ch c charset h p l l utf8. N u b n mu n t o ra cc file ci t cho CSDL khng ph i l utf8 b n s b qua thu c tnh ny. Thu c tnh driver xc nh CSDL no cc cu truy v n c vi t cho. Hi n t i, thu c tnh ny ch c th l mysql, nhng cc phin b n joomla trong tng lai c th c nhi u d ng CSDL hn.

5. K t lu n
Cho n by gi chng ta c m t component t n d ng c cc thu n l i c a c cc l p Joomla! MVC framework v l p JDatabase. By gi b n c kh nng vi t cc component MVC tng tc v i CSDL v c th s d ng Joomla! Installer t o v thao tc trn cc b ng CSDL.

6. Nh ng ng i vi t v

a ch download v d

Nh ng ng i tham gia vi t bi h ng d n ny: staalanden Component c th c download t i:

http://dev.joomla.org/components/com_jd-wiki/data/media/components/com_hello3.zip

Copyleft by on Thanh Tm

Trang 19/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

PH N 4. T O GIAO DI N QU N TR TRONG MVC.


(Ph n h ng d n ny c d ch t trang web: http://dev.joomla.org/component/option,com_jd-wiki/Itemid,/id,components:hello_world_mvc4/).

1. Gi i thi u
Trong ba bi h ng d n tr c (ph n 1, 2 v 3) chng ta pht tri n m t component MVC l y d li u t m t b ng trong CSDL. Cho n th i i m hi n t i component c a chng ta cha c cch no b sung thm d li u t i CSDL, ngo i tr vi c th c hi n i u ny m t cch th cng b ng m t cng c khc. Trong ph n ny chng ta s pht tri n m t section qu n tr cho component, c kh nng qu n l cc entry trong CSDL.

2. T o ra frameword c s
Frameword c s c a panel qu n tr cng tng t nh ph n site. i m vo chnh cho ph n qu n tr l file admin.hello.php. File ny gi ng y h t file hello.php c s d ng c thay i thnh trong ph n site ngo i tr tn c a controler m n t i s HellosController. Ngoi ra, controler m c nh c g i l controller.php v file ny gi ng y h t controler m c nh trong ph n site, ngo i tr tn c a controler c g i l HellosController thay v HelloController. S thay i ny JControler theo m c nh s t i hellos view, view ny s hi n th m t danh sch cc cu cho m ng. D i y l code c a admin.hello.php
<?php /** * @package * * @license */ // no direct access defined( '_JEXEC' ) or die( 'Restricted access' ); // Require the base controller require_once( JPATH_COMPONENT.DS.'controller.php' ); // Require specific controller if requested if($controller = JRequest::getWord('controller')) { $path = JPATH_COMPONENT.DS.'controllers'.DS.$controller.'.php'; if (file_exists($path)) { require_once $path; } else { $controller = ''; } Joomla.Tutorials @link GNU/GPL http://dev.joomla.org/component/option,com_jd* @subpackage Components wiki/Itemid,31/id,tutorials:components/

Copyleft by on Thanh Tm

Trang 20/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

} // Create the controller $classname $controller = 'HellosController'.$controller; = new $classname( );

// Perform the Request task $controller->execute( JRequest::getVar( 'task' ) ); // Redirect if set by the controller $controller->redirect(); ?>

Chng s b t

u v i view hellos v model hellos.

u tin l model hellos.

2.1. Model Hellos


Model Hellos s r t n gi n. Hi n t i, cng vi c m chng ta c n ch l truy v n nh n c m t danh sch c a cc cu cho m ng t CSDL. Cng vi c ny s c th c hi n b ng cch g i phng th c getData(). L p JModel c m t phng th c protected c xy d ng s n _getList(). Phng th c ny c th c s d ng n gi n ha tc v truy v n nh n c m t danh sch cc b n ghi t CSDL. n gi n l chng ta c n truy n cho n cu truy v n v n s tr l i danh sch cc b n ghi. Trong tng lai, c th chng ta l i mu n s d ng cu truy v n trong m t phng th c khc. V v y, y chng ta s t o ra m t phng th c private _buildQuery() s tr l i cu truy v n s c truy n vo phng th c _getList(). i u ny s t o ra kh nng thay i cu truy v n khi n c t trong m t tnh hu ng khc. Do trong l p c a chng ta s c hai phng th c: getData() v _buildQuery(). Phng th c _buidQuery n gi n l tr v cu truy v n. Code c a n nh sau:
/** * Returns the query * @return string The query to be used to retrieve the rows from the database */ function _buildQuery() { $query = ' SELECT * ' . ' FROM #__hello ' ; return $query; }

Copyleft by on Thanh Tm

Trang 21/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5 Phng th c getData() nh n cu truy v n v tr l i danh sch cc b n ghi t CSDL. By gi c th x y ra tnh hu ng l chng ta c n nh n c danh sch ny 2 l n trong vi c t i m t trang. Th t l lng ph khi truy v n CSDL 2 l n. B i v y chng ta s ph i lm cho phng th c ny lu tr d li u trong m t thu c tnh protected trong cc yu c u ti p theo, n ch n gi n l tr v d li u m n l y c. Thu c tnh ny s c g i l _data. D i y l code c a phng th c getData()
/** * Retrieves the hello data * @return array Array of objects containing the data from the database */ function getData() { // Lets load the data if it doesn't already exist if (empty( $this->_data )) { $query = $this->_buildQuery(); $this->_data = $this->_getList( $query ); } return $this->_data; }

Code
<?php /**

c a model sau khi hon thnh nh sau:

* Hellos Model for Hello World Component * * @package * * @license */ // Check to ensure this file is included in Joomla! defined('_JEXEC') or die(); jimport( 'joomla.application.component.model' ); /** * Hello Model * Joomla.Tutorials @link GNU/GPL http://dev.joomla.org/component/option,com_jd* @subpackage Components wiki/Itemid,31/id,tutorials:components/

Copyleft by on Thanh Tm

Trang 22/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

* @package

Joomla.Tutorials

* @subpackage Components */ class HellosModelHellos extends JModel { /** * Hellos data array * * @var array */ var $_data; /** * Returns the query * @return string The query to be used to retrieve the rows from the database */ function _buildQuery() { $query = ' SELECT * ' . ' FROM #__hello ' ; return $query; } /** * Retrieves the hello data * @return array Array of objects containing the data from the database */ function getData() { // Lets load the data if it doesn't already exist if (empty( $this->_data )) { $query = $this->_buildQuery(); $this->_data = $this->_getList( $query ); } return $this->_data; }

Copyleft by on Thanh Tm

Trang 23/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

File ny c lu l i thnh models/hellos.php.

2.2. View hellos


By gi chng ta c m t model nh n d li u, chng ta c n hi n th n. View hellos ny s kh gi ng v i view trong ph n site. Model c a chng ta c t ng ci t trn site, b i v y n n m trong ph n qu n tr . Cc phng th c b t u b ng get trong model c th c truy c p b ng vi c s d ng phng th c get() c a l p JView. B i v y view c a chng ta s c 3 dng. M t l y d li u t model, m t y d li u ln template, v m t g i phng th c display hi n th . B i v y chng ta c code nh sau:
<?php /** * Hellos View for Hello World Component * * @package * * @license */ // Check to ensure this file is included in Joomla! defined('_JEXEC') or die(); jimport( 'joomla.application.component.view' ); /** * Hellos View * * @package */ class HellosViewHellos extends JView { /** * Hellos view display method * @return void **/ function display($tpl = null) { Joomla.Tutorials * @subpackage Components Joomla.Tutorials @link GNU/GPL http://dev.joomla.org/component/option,com_jd* @subpackage Components wiki/Itemid,31/id,tutorials:components/

Copyleft by on Thanh Tm

Trang 24/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

JToolBarHelper::title( 'generic.png' );

JText::_(

'Hello

Manager'

),

JToolBarHelper::deleteList(); JToolBarHelper::editListX(); JToolBarHelper::addNewX(); // Get data from the model $items =& $this->get( 'Data'); $this->assignRef( 'items', $items ); parent::display($tpl); } }

File ny c lu thnh views/hellos/view.html.php.

2.3. Template hellos


Template s l y d li u c a n t view v a d li u ra u ra hi n th . Chng ta s hi n th k t qu u ra trong m t b ng n gi n. Trong khi template ph n x l site l r t n gi n, th trong trang qu n tr chng ta s c n m r ng m t cht vng l p thng qua d li u. D i y l code trong template c a chng ta:
<?php defined('_JEXEC') or die('Restricted access'); ?> <form action="index.php" method="post" name="adminForm"> <div id="editcell"> <table class="adminlist"> <thead> <tr> <th width="5"> <?php echo JText::_( 'ID' ); ?> </th> <th> <?php echo JText::_( 'Greeting' ); ?> </th> </tr> </thead> <?php $k = 0; for ($i=0, $n=count( $this->items ); $i < $n; $i++) {

Copyleft by on Thanh Tm

Trang 25/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

$row =& $this->items[$i]; ?> <tr class="<?php echo "row$k"; ?>"> <td> <?php echo $row->id; ?> </td> <td> <?php echo $row->greeting; ?> </td> </tr> <?php $k = 1 - $k; } ?> </table> </div> <input type="hidden" name="option" value="com_hello" /> <input type="hidden" name="task" value="" /> <input type="hidden" name="boxchecked" value="0" /> <input type="hidden" name="controller" value="hello" /> </form>

Template ny c lu thnh views/hellos/tmpl/default.php. Ch r ng template c a chng ta c gi trong m t form. M c d i u ny l khng c n thi t vo th i i m hi n t i, nhng trong tng lai n s c n. By gi chng ta hon thnhm ph n c b n c a view u tin. Chng ta b sung thm 5 file vo ph n qu n tr trong component: admin.hello.php controller.php models/hellos.php views/hellos/view.html.php views/hellos/tmpl/default.php By gi b n c th b sung cc file ny vo file ci t XML. V th l i.

3. B sung thm ch c nng


Section qu n tr c a chng ta cho n th i i m hi n t i cha th c hi n nhi u tc v . N th c s cha lm i u g. Nh ng g n th c s lm l hi n th nh ng entry m chng

Copyleft by on Thanh Tm

Trang 26/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5 ta c trong CSDL. ng link. lm n h u d ng hn chng ta c n b sung thm cc button v cc

3.1. Toolbar
Chng ta c th th y toolbar xu t hi n pha trn cc panel khc trong component qu n tr c a joomla. Component c a chng ta cng c n m t th tng t nh th . Chng ta s b sung thm cc nt xa b n ghi, hi u ch nh b n ghi, thm b n ghi m i. Ngoi ra chng ta s cn b sung thm m t title th hi n trn toolbar. i u ny c th c hi n b ng cch b sung thm code vo view. b sung thm cc button chng ta s d ng cc phng th c tnh t l p JToolbarHepper trong joomla. Code s trng nh sau:
JToolBarHelper::title( JText::_( 'Hello Manager' ), 'generic.png' );

JToolBarHelper::deleteList(); JToolBarHelper::editListX(); JToolBarHelper::addNewX();

Ba phng th c ny s t o ra cc button ph h p. Phng th c deleteList() c th ty ch n l y ba tham s : Tham s u tin l m t chu i hi n th n ng i dng yu c u h xc nh n vi c xa b n ghi. Tham s th hai l nhi m v s c g i v i cu truy v n (m c nh l remove). V tham s th 3 l o n text s c th hi n d i button. u Cc phng th c editLisstX() v addNewX() c th ty ch n hai tham s : Tham s tin l nhi m v (theo m c nh l n l t l edit v add), v tham s th 2 l o n text s c th hi n d i button. Ch r ng cch s d ng phng th c JText::_ trong template tr c y v y l tng t nhau. y l ch c nng gip cho component c th chuy n i m t cch r t d dng. Phng th c JText::_ s tm ki m xu trong file ngn ng c a component v tr l i chu i c chuy n i. N u khng c s chuy n i no c tm th y n s tr l i chnh chu i truy n vo cho n. N u chng ta mu n chuy n i component sang m t ngn ng khc, t t c nh ng g ph i lm l t o ra m t file ngn ng nh x xu trong d u trch d n v i xu c chuy n i tng ng. [V d : n u trong file ngn ng chng ta c m t c p Greeting Hello world th phng th c JText::_(Greeting) s tr l i chu i Hello World. Khi chng ta c n chuy n qua ti ng Vi t, trong file ngn ng chng ta ch c n c m t c p Greeting Xin cho! lc ny phng th c JText::_(Greeting) s tr l i chu i Xin cho!.]

3.2. Checkbox v link


By gi chng ta c hai button. Hai button ny thao tc trn cc b n ghi t n t i. Nhng lm th no chng ta bi t chng ta ang thao tc trn b n ghi no? Chng ta ph i yu c u ng i dng ni cho chng ta bi t i u . lm i u ny chng ta c n b sung thm cc checkbox vo b ng hi n th trn template ng i dng c th l a ch n cc b n ghi th c s . b sung thm cc chekbox chng ta c n b sung thm m t c t vo b ng. Chng ta s b sung c t ny vo gi a hai c t c trn.

Copyleft by on Thanh Tm

Trang 27/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5 Trong ph n u c a c t, chng ta s thm m t checkbox checkbox d i n thnh on ho c off.
<th width="20"> <input type="checkbox" name="toggle" value="" onclick="checkAll(<?php echo count( $this->items ); ?>);" /> </th>

c th l a ch n t t c cc

y, hm checkAll trong Javascript l m t hm c xy d ng trong Joomla! d a trn gi Javascript s cung c p nh ng ch c nng m chng ta mu n. By gi chng ta c n b sung cc checkbox vo cc t ng hng. L p JHTML c a Joomla c mt phng th c JHTML::_() t o ra checkbox. Chng ta s b sung dng code d i y vo vng l p.
$checked = JHTML::_( 'grid.id', $i, $row->id );

Ngay pha sau dng:


$row =& $this->items[$i];

Sau chng ta s thm cc cell c a c t checkbox n m gi a hai c t c (c t id v c t greeting):


<td> <?php echo $checked; ?> </td>

n lc ny, hi u ch nh m t b n ghi, chng ta c n ph i check vo box tng ng v i b n ghi , sau click vo nt edit. Vi c ny c v hi r m r. B i th chng ta s b sung m t ng link i tr c ti p n form hi u ch nh cu cho m ng. B sung thm dng d i y sau khi g i phng th c JHTML::_() t o ra link HTML.
$link = JRoute::_( 'index.php?option=com_hello>controller=hello>task=edit>cid[]='. $row>id );

Sau a ng link vo trong cell ch a cu cho m ng:

Copyleft by on Thanh Tm

Trang 28/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

<td> <a href="<?php echo $link; ?>"><?php echo $row->greeting; ?></a> </td>

Ch r ng ng link ny ch n controler hello. Controler ny s x l vi c thao tc trn d li u. N u xem l i code trong ph n template b n s th y chng ta s c 4 tr ng hidden input pha d i form. Tr ng u tin c l option, tr ng ny c n thi t xc nh chng ta ang trong component com_hello. Tr ng th hai l nhi m v c n th c hi n, tr ng ny s l y cc thi t l p khi m t trong s cc nt trn toolbar c click, N u tr ng ny b b tr ng th chng ta s bo l i v cc button s c disable. Tr ng hidden input th ba l tr ng boxchecked, tr ng ny s gi s l ng box c check. Cc button edit v delete s ki m tra ch c ch n r ng s ny l l n hn 0, v chng s khng cho php form c submit n u i u ki n trn khng th a mn. Tr ng th 4 l tr ng controler, tr ng ny c s d ng xc nh r ng cc nhi m v c t o ra t form ny s c x l b i controler hello. y l code y c a file default.php:
<?php defined('_JEXEC') or die('Restricted access'); ?> <form action="index.php" method="post" name="adminForm"> <div id="editcell"> <table class="adminlist"> <thead> <tr> <th width="5"> <?php echo JText::_( 'ID' ); ?> </th> <th> <?php echo JText::_( 'Greeting' ); ?> </th> </tr> </thead> <?php $k = 0; for ($i=0, $n=count( $this->items ); $i < $n; $i++) { $row =& $this->items[$i]; ?> <tr class="<?php echo "row$k"; ?>"> <td> <?php echo $row->id; ?>

Copyleft by on Thanh Tm

Trang 29/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

</td> <td> <?php echo $row->greeting; ?> </td> </tr> <?php $k = 1 - $k; } ?> </table> </div> <input type="hidden" name="option" value="com_hello" /> <input type="hidden" name="task" value="" /> <input type="hidden" name="boxchecked" value="0" /> <input type="hidden" name="controller" value="hello" /> </form>

View hellos c a chng ta hon thnh. B n c th th cc k t qu c a component ny ngay by gi . Component c th download t i:


http://dev.joomla.org/components/com_jd-wiki/data/media/components/com_hello4a.zip

4. Getting Down and Dirty: Doing the Real Work


Cho n by gi view hellos lm vi c t t. Chng ta s chuy n sang model v view hello. y l ni thao tc th c s nh add, edit, s c th c hi n.

4.1. Hello Controler


Our default controller just isnt going to cut it when it comes to doing work - all it is capable of doing is displaying views [t m d ch Controler m c nh s khng ng t gi a ch ng khi n khi n ang lm vi c- t t c ch l kh nng lm hi n th cc view]. Chng ta c n x l cc nhi m v m chng ta c view hellos: add, edit v remove. Add v edit v b n ch t l hai tc v tng t nhau. C hai u th hi n m t form n ng i dng cho php hi u ch nh m t cu cho m ng. Ch c s khc nhau l add s hi n th m t form tr ng, cn edit s hi n th m t form c d li u c a n trong . B i v cc tc v gi ng nhau nn chng ta s nh x tc v add vo trong tc v edit. i u ny c th c hi n trong hm kh i t o:
/** * constructor (registers additional tasks to methods) * @return void

Copyleft by on Thanh Tm

Trang 30/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

*/ function __construct() { parent::__construct(); // Register Extra tasks $this->registerTask( 'add' } , 'edit' );

Tham s u tin c a JControler::registerTask l tc v c n nh x v tham s th hai l phng th c m n s nh x n. Chng ta s b t u x l tc v edit. Cng vi c c a controler l kh n gi n i v i tc v edit. T t c nh ng g m n ph i lm l xc nh view v form layout c n t i (hello view v form layout). Ngoi ra, chng ta s ni v i joomla disable main menu trong khi chng ta hi u ch nh cu cho m ng. i u ny s ngn ng i dng kh i vi c thot m qun khng lu cc b n ghi ang m . Code cho tc v edit c a chng ta s nh sau:
/** * display the edit form * @return void */ function edit() { JRequest::setVar( 'view', 'hello' ); JRequest::setVar( 'layout', 'form' JRequest::setVar('hidemainmenu', 1); parent::display(); } );

4.2. Hello View


Hello view s hi n th m t form cho php ng i dng hi u ch nh cu cho m ng. Phng th c display c a view ph i th c hi n m t s tc v n gi n sau: Nh n d li u t model (retrieve the data from the model) T o toolbar (create the toolbar) Chuy n d li u vo template (pass the data into the template) G i phng th c display tr l i template (invoke the display() method to render the template) Vi c th c hi n cc tc v trn c m t cht ph c t p, v m t view s x l c hai nhi m v edit v task. Trong toolbar chng ta mu n ng i dng bi t h ang add hay edit, b i th chng ta c n ph i xc nh tc v no c t o ra.

Copyleft by on Thanh Tm

Trang 31/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5 V chng ta nh n l i cc b n ghi mu n hi n th t model, nn chng ta c th s d ng d li u ny xc nh tc v no c a ra. N u tc v l edit th tr ng id s c thi t l p, n u nhi m v l add th n s khng c thi t l p. i u ny c th c s d ng xc nh xem chng ta c m t b n ghi m i hay m t b n ghi t n t i. Chng ta s b sung thm 2 button vo toolbar: save v cancel. Tuy cc ch c nng l gi ng nhau, nhng chng ta mu n vi c hi n th c a cc nt ph i khc nhau, ph thu c vo n l m t b n ghi m i hay m t b n ghi t n t i. N u n l b n ghi m i, chng ta s th hi n nt cacel, n u n l b n ghi t n t i, chng ta s th hi n nt close. V v y phng th c c a chng ta s nh sau:
/** * display method of Hello view * @return void **/ function display($tpl = null) { //get the hello $hello $isNew =& $this->get('Data'); = ($hello->id < 1);

$text = $isNew ? JText::_( 'New' ) : JText::_( 'Edit' ); JToolBarHelper::title( $text.' ]</small></small>' ); JToolBarHelper::save(); if ($isNew) } else { // for existing items the button is renamed `close` JToolBarHelper::cancel( 'cancel', 'Close' ); } $this->assignRef('hello', $hello); parent::display($tpl); } { JToolBarHelper::cancel(); JText::_( 'Hello' ).': <small><small>[ ' .

4.3. Hello Model


View c a chng ta c n ph i c d li u. V v y chng ta ph i t o ra m t model t o ra m t cu cho m ng. Model c a chng ta s c 2 thu c tnh: _id v _data. _id s gi id c a cu cho m ng v _data s ch a d li u. Chng ta s b t u v i m t hm kh i t o h ng t i vi c nh n id t truy v n:

Copyleft by on Thanh Tm

Trang 32/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

/** * Constructor that retrieves the ID from the request * * @access * @return */ function __construct() { parent::__construct(); public void

$array = JRequest::getVar('cid', $this->setId((int)$array[0]); }

0, '', 'array');

Phng th c JRequest::getVar() c s d ng nh n d li u t request. Tham s u tin l tn c a bi n form. Tham s th hai l gi tr m c nh s c gn n u khng c gi tr no c tm th y. Tham s th 3 l tn c a hash nh n d li u t (get, post, vv) v gi tr cu i cng l ki u d li u c a gi tr . Hm kh i t o c a chng ta s l y gi tr u tin t m ng cid v gn n cho id. Phng th c setId() c s d ng thi t l p id. Vi c thay i id m model c a chng ta tr t i c ngha l d li u m id tr t i s khng cn ng n a. Do , khi chng ta thi t l p id chng ta c n clear thu c tnh data.
/** * Method to set the hello identifier * * @access * @param * @return */ function setId($id) { // Set id and wipe data $this->_id $this->_data } = $id; = null; public int Hello identifier void

Cu i cng, chng ta c n m t phng th c

nh n d li u: getData().

Copyleft by on Thanh Tm

Trang 33/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5 Phng th c getData s ki m tra xem thu c tnh data c thi t l p hay cha. N u n c thi t l p th getData s tr l i n, n u khng getData s t i d li u t CSDL.
** * Method to get a hello * @return object with data */ function &getData() { // Load the data if (empty( $this->_data )) { $query = ' SELECT * FROM #__hello '. ' WHERE id = '.$this->_id; $this->_db->setQuery( $query ); $this->_data = $this->_db->loadObject(); } if (!$this->_data) { $this->_data = new stdClass(); $this->_data->id = 0; $this->_data->greeting = null; } return $this->_data; }

4.4. The form


By gi , cng vi c cn l i l t o ra form a d li u vo. V chng ta xc nh layout c a chng ta nh m t form. Form s c trong m t file trong th m c tmp c a hello view g i l form.php:
<?php defined('_JEXEC') or die('Restricted access'); ?> <form action="index.php" method="post" name="adminForm" id="adminForm"> <div class="col100"> <fieldset class="adminform"> <legend><?php echo JText::_( 'Details' ); ?></legend> <table class="admintable"> <tr> <td width="100" align="right" class="key">

Copyleft by on Thanh Tm

Trang 34/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

<label for="greeting"> <?php echo JText::_( 'Greeting' ); ?>: </label> </td> <td> <input class="text_area" type="text" name="greeting" id="greeting" size="32" maxlength="250" value="<?php echo $this->hello>greeting;?>" /> </td> </tr> </table> </fieldset> </div> <div class="clr"></div> <input type="hidden" name="option" value="com_hello" /> <input type="hidden" name="id" value="<?php echo $this->hello->id; ?>" /> <input type="hidden" name="task" value="" /> <input type="hidden" name="controller" value="hello" /> </form>

Ch r ng trong vi c b sung tr ng input, c m t tr ng hidden input cho id. Ng i dng s khng c n hi u ch nh id, nn chng ta s khng th hi n n trn form.

4.5. Ci

t cc ch c nng

Cho n lc ny controler c a chng ta ch th c thi hai nhi m v : edit v new. Tuy nhin chng ta cn c cc nt save, delete, v cancel cc b n ghi. Chng ta c n vi t cc hm x l v th c hi n cc tc v ny. 4.5.1. Lu b n ghi B c ti p theo l ci t ch c nng lu b n ghi. Thng th ng, c n ph i c m t vi s thay i x l cc tr ng h p khc nhau, nh s khc nhau gi a vi c t o b n ghi m i (cu l nh INSERT) v c p nh t b n ghi t n t i (cu l nh UPDATE). Ngoi ra r t ph c t p c th l y d li u t form v a n vo cu truy v n. Tuy nhin, Joomla! Framework chu n b vi c ny kh c n th n cho b n. L p JTable gip vi c thao tc d dng trn cc b n ghi trn CSDL m khng ph i lo l ng v vi c vi t cc l nh SQL n m bn d i. N cn gip vi c chuy n d li u t HTML vo CSDL c d dng. a) T o l p table L p table l m t l p tr u t ng t b n c th t o ra cc l p con lm vi c v i cc b ng c th . th c hi n i u n gi n l chng ta t o ra m t l p k th a l p

Copyleft by on Thanh Tm

Trang 35/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5 JTable, b sung cc tr ng d li u nh cc thu c tnh v ghi hm kh i t o tn c a b ng v kha chnh. D i y l l p JTable c a chng ta:
<?php /** * Hello World table class * @package Joomla.Tutorials * @subpackage Components * @link http://dev.joomla.org/component/option,com_jdwiki/Itemid,31/id,tutorials:components/ * @license */ // no direct access defined('_JEXEC') or die('Restricted access'); /** * Hello Table class * * @package */ class TableHello extends JTable { /** * Primary Key * * @var int */ var $id = null; /** * @var string */ var $greeting = null; /** * Constructor * * @param object Database connector object */ function TableHello( &$db ) { Joomla.Tutorials * @subpackage Components GNU/GPL

xc

nh

Copyleft by on Thanh Tm

Trang 36/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

parent::__construct('#__hello', 'id', $db); } } ?>

y b n s th y, chng ta nh ngha hai tr ng: tr ng id v tr ng greeting. Sau chng ta nh ngha m t hm kh i t o, n s g i hm kh i t o c a l p cha v truy n vo tn c a b ng (hello), tn c a tr ng l kha chnh (id) v i t ng k t n i CSDL. File ny s c g i hello.php v n s n m trong th m c table trong ph n qu n tr c a component. b) Ci t ch c nng trong model By gi chng ta s n sng b sung phng th c vo model n lu l i b n ghi. Chng ta s g i phng th c ny lu tr . Phng th c store() s th c hi n 3 vi c: k t kh i d li u t form vo i t ng TableHello, ki m tra ch c ch n r ng b n ghi c nh d ng ng, v lu d li u vo CSDL. Phng th c c a chng ta nh sau:
/** * Method to store a record * * @access * @return */ function store() { $row =& $this->getTable(); $data = JRequest::get( 'post' ); // Bind the form fields to the hello table if (!$row->bind($data)) { $this->setError($this->_db->getErrorMsg()); return false; } // Make sure the hello record is valid if (!$row->check()) { $this->setError($this->_db->getErrorMsg()); return false; } public boolean True on success

Copyleft by on Thanh Tm

Trang 37/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

// Store the web link table to the database if (!$row->store()) { $this->setError($this->_db->getErrorMsg()); return false; } return true; }

Phng th c ny c b sung vo model hello. Phng th c s c m t tham s . N l m t m ng lin k t d li u m chng ta mu n lu tr vo CSDL. i u ny c th c th c hi n d dng t cu truy v n s c xem xt trong ph n sau Chng ta th y r ng dng u tin tr l i m t tham chi u n i t ng JTable. N u chng ta t tn table chnh xc chng ta s khng ph i xc nh tn c a n - l p JModel s bi t t tm n u. Nh c l i r ng l p table c a chng ta c g i l TableHello v t trong file hello.php n m trong th m c tables. N u b n tun theo quy lu t ny l p ng. JModel c th t o ra i t ng c a b n m t cch t Dng th hai s nh n l i d li u t form. L p JRequest s th c hi n i u ny r t d dng. Trong tr ng h p ny chng ta s nh n l i t t c cc bi n m chng ta submit s d ng phng th c POST. i u ny s tr l i m t m ng lin k t. Ph n cn l i l r t d dng. Chng ta gn d li u, ki m tra v lu tr . Phng th c bind() s copy d li u t m ng vo thu c tnh tng ng c a i t ng table. Trong tr ng h p ny, phng th c bind() s l y gi tr c a id v greeting sau copy chng vo cc thu c tnh c a i t ng table. Phng th c store() l y d li u t i t ng v lu n vo CSDL. N u id =0 n s t o ra m t b n ghi m i (cu l nh insert), n u khng n s c p nh t b n ghi c (cu l nh update). c) B sung tc v vo controler By gi chng ta s b sung tc v vo controler. V tc v m chng ta ang thuwcj hi n l save, nn chng ta ph i g i phng th c save:
/** * save a record (and redirect to main page) * @return void */ function save() { $model = $this->getModel('hello'); if ($model->store()) {

Copyleft by on Thanh Tm

Trang 38/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5

$msg = JText::_( 'Greeting Saved!' ); } else { $msg = JText::_( 'Error Saving Greeting' ); } // Check the table in so it can be edited.... we are done with it anyway $link = 'index.php?option=com_hello'; $this->setRedirect($link, $msg); }

T t c nh ng g chng ta lm l l y model v g i phng th c store. Sau chng ta s d ng phng th c setRedirect() redirect tr l i danh sch cc cu cho m ng. Ngoi ra chng ta cn truy n cho n m t message, message ny s c hi n th pha trn u c a trang. 4.5.2. Xa m t b n ghi a) Ci t ch c nng trong Model Trong model chng ta s nh n l i m t danh sch cc id c n xa v g i l p JTable xa chng.
/** * Method to delete record(s) * @access * @return */ function delete() { $cids = JRequest::getVar( 'cid', array(0), 'post', 'array' ); $row =& $this->getTable(); foreach($cids as $cid) { if (!$row->delete( $cid )) { $this->setError( $row->getErrorMsg() ); return false; } } return true; } public boolean True on success

Copyleft by on Thanh Tm

Trang 39/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5 Chng ta g i phng th c JRequest::getVar() l y d li u t request sau g i phng th c $rowdelete() xa m i dng. B ng vi c lu tr cc l i trong model chng ta s c th nh n l i chng sau n u chng ta mu n. b) X l tc v remove trong controler Tng t nh phng th c save() trong vi c x l tc v lu tr .
** * remove record(s) * @return void */ function remove() { $model = $this->getModel('hello'); if(!$model->delete()) { $msg = JText::_( 'Error: One or More Greetings Could not be Deleted' ); } else { $msg = JText::_( 'Greeting(s) Deleted' ); } $this->setRedirect( 'index.php?option=com_hello', $msg ); }

4.5.3. H y b qu trnh hi u ch nh h y b vi c edit, t t c nh ng g chng ta c n lm l redirect l i main view.


/** * cancel editing a record * @return void */ function cancel() { $msg = JText::_( 'Operation Cancelled' ); $this->setRedirect( 'index.php?option=com_hello', $msg ); }

5. K t lu n
We have now implemented a basic backend to our component. We are now able to edit the entries that are viewed in the frontend. We have demonstrated the interaction

Copyleft by on Thanh Tm

Trang 40/41

Email: tamdt_a9tth@yahoo.com

Ti li u h ng d n xy d ng component trong Joomla! 1.5 between models, views and controllers. We have shown how the JTable class can be extended to provide easy access to tables in the database. It can also be seen how the JToolBarHelper class can be used to create button bars in components to present a standardized look between components. .

6. Nh ng ng i vi t v

a ch download v d

Nh ng ng i tham gia vi t bi h ng d n ny: staalanden Component c th c download t i:


http://dev.joomla.org/components/com_jd-wiki/data/media/components/com_hello4.zip

Copyleft by on Thanh Tm

Trang 41/41

Email: tamdt_a9tth@yahoo.com

You might also like