27 July 2009 0 Comments

Joomla! popup window design using the MVC concept

我们可以很容易的写个程序来制造出个弹出窗口。Joomla推荐使用MVC，我们来看看用MVC有什么好处。

什么是MVC， wikipedia是这么介绍的：

MVC（Model-View-Controller，模型—檢視—控制器模式）是軟體專案中的一種軟體架構模式。它把軟體系統分為三個基本部分：模型（Model），檢視（View）和控制器（Controller）。。。模型—檢視—控制器模式的目的是實作一種動態的程式設計，使後續對程式的修改和擴展簡化，並且使程式某一部分的重複利用成為可能。除此之外此模式透過對複雜度的簡化使程式結構更加直覺。

Summary

In order to adapt the MVC concept, we will need a view, a controller and a model. Because this example is simple, and we have only used a view, a controller.

The folder structure is as follows:

/components/com_js/js.php
/components/com_js/views/modalcontent/tmpl/default.php
/components/com_js/views/modalcontent/view.raw.php

The js.php program is the Controller. It has the modalBoxMVC function, which output a link and the parameters for the pop up window.

view.raw.php is the View and it just return JView::display(). This is default in Joomla!. It will call default.php as a default.

The default.php can be think as a basic html page.

Codes

js.php

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
defined( '_JEXEC' ) or die( 'Restricted access' );

jimport('joomla.application.component.controller');

class JsController extends JController {
function modalBoxMVC()  {

$params = array(
'size' => array(
'x' => 350,
'y' => 100
)
);

JHTML::_('behavior.modal', 'a.popup',$params);

?>
<a class="popup" href="index.php?option=com_js&amp;view=modalcontent&amp;format=raw">Read about the pop up window.</a>
}

}

$controller = new JsController();
$controller-&gt;execute(JRequest::getCmd('task'));

view.raw.php

1
2
3
4
5
6
7
defined( '_JEXEC' ) or die( 'Restricted access' );

jimport( 'joomla.application.component.view');

class JsViewModalcontent extends JView {

}

default.php

1
2
3
4
5
6
7
8
<?php defined( '_JEXEC' ) or die( 'Restricted access' ); ?>

<h1>Wei Jiang's Website</h1>
<ul>
   <li>Joomla tutorial</li>
   <li>Chinese/English Contents</li>
   <li>Hahaha</li>
</ul>

Output & Result

MVC-Joomla-popup.png
Tags: ,