LẬP TRÌNH WEB CHUYÊN sâu với CMS JOOMLA bài 5

§ Ví dụ: – class JHTML cung cấp các phương thức giúp xử lý hiển thị giao diện như: bảng grid, listcombobox, listbox, tooltip, datetimepicker, …– class JTable giúp cập nhật dữ liệu mà kh

LẬP TRÌNH WEB

CHUYÊN SÂU VỚI CMS

JOOMLA

tiện ích Các class này giúp ta hiển thị giao

diện và lập trình nhanh hơn.

§ Ví dụ:

– class JHTML cung cấp các phương thức giúp

xử lý hiển thị giao diện như: bảng (grid), list(combobox, listbox), tooltip, datetimepicker,

…– class JTable giúp cập nhật dữ liệu mà không

cần viết lệnh SQL

– Class JHTML cung cấp các tiện ích về giao

diện

– Để dùng class JHTML, ta phải tham chiếu

đến file html.php chứa class này:

jimport('joomla.html.html');

– Cú pháp chung:

JHTML::_('type', <các thuộc tính ứng với type>)

type: loại control: grid, list, select, image, …

mỗi type sẽ có các thuộc tính đi kèm.

– Class JHTML cung cấp các tiện ích về giao

diện

– Ví dụ: Hiển thị control chọn ngày:

echo JHTML::_('calendar', null, 'ngay', 'ngay');

– Trước khi gọi hàm hiển thị tooltip, ta phải thực

– Cú pháp:

JHTML::_(date, value, [format]);

– Ví dụ: hiển thị ngày hiện hành theo định dạng

ngày/tháng/năm

$today = date('Y-m-d h:m:s');

echo JHTML::_('date', $today, '%d/%m/%Y');

– Cú pháp:

JHTML::_(list.section, name, [active], [javascript], [order]);

Giải thích:

- active: id của section được chọn

- javascript: gọi hàm javascript để xử lý biến cố Ví dụ:

onchange=cboSection_onchange()

- order: biểu thức order by của lệnh sql để sắp xếp dữ

liệu, mặc định sắp xếp theo cột ordering

– Ví dụ: Hiển thị combobox chứa dữ liệu bảng Section

echo JHTML::_('list.section', 'mysection');

– Ví dụ: Hiển thị combobox section, mặc định chọn dòng có id=5, và gọi hàm javascript để xử lý chọn.

echo JHTML::_('list.section', 'mysection', 5,

'onchange=mysection_onchange();');

§ Hiển thị list categories

– Cú pháp:

JHTML::_(list.category, name, section, [active], [javascript], [order], [size], [sel_cat]);

Giải thích:

- name: name của combobox Ví dụ: cboCategory

- active: id của section được chọn

- javascript: gọi hàm javascript để xử lý biến cố order: biểu thức

- order by của lệnh sql để sắp xếp dữ

- size: quy định hình thức hiển thị là combobox hay listbox

- sel_cat: có hiển thị dòng Select a Category ở đầu hay không?

(mặc định Có)

– Ví dụ: Hiển thị combobox để chọn các category thuộc

về section có id=5.

echo JHTML::_('list.category', 'cboTheGioi', 5);

– Ví dụ: Hiển thị listbox để chọn các category thuộc về

section có id=5.

echo JHTML::_('list.category',

'cboTheGioi', 5, '','','ordering', 3, false);

– Joomla hỗ trợ hiển thị list với nguồn dữ liệu là mảng

- name: name của list Ví dụ: cboTinhThanh

- attribs: các attribute của thẻ select Ví dụ: style,

onchange, …

- key: tên cột trả về giá trị

- text: tên cột dùng để hiển thị

- selected: giá trị chọn

– Ví dụ: Hiển thị combobox nhà cung cấp

'Ten_nha_xuat_ban');

– Dùng để tạo các đối tượng của Joomla.

– Ví dụ:

• Tạo đối tượng truy xuất CSDL

$db =& JFactory::getDBO();

• Tạo đối tượng truy xuất trang web hiện hành

$document =& JFactory::getDocument();

• Tạo đối tượng Editor – đối tượng dùng đề tạo các HTML Editor cho trang web.

$editor =& JFactory::getEditor();

– Dùng để lấy giá trị các tham số gửi từ client vềserver

– Ví dụ: lấy mã khách hàng từ URL

http://localhost/joomla/index.php?option=com_khachhang&makh=2

$makh = JRequest::getVar( 'makh', '-1');

Hoặc

$makh = JRequest::getVar( 'makh', '-1', 'get');

– Tham chiếu đến Session

$session =& JFactory::getSession();

– Lưu giá trị vào Session

$session->set('name', $value);

– Đọc giá trị từ Session

$value = $session->get('name');

– JDocument là đối tượng chứa thông tin về

trang web

– Tham chiếu đến JDocument

$document =& JFactory::getDocument();

– Hiệu chỉnh tiêu đề trang web

$document->setTitle('tiêu đề');

– Thêm javascript vào trang web:

• Tham chiếu đến 1 file javascript:

– Thêm javascript vào trang web:

• Tham chiếu đến đoạn code javascript:

addScriptDeclaration(chuoi_js)

Ví dụ: tham chiếu đến 1 đoạn code javascript chứa hàm hello để xuất ra câu chào

$document =& JFactory::getDocument();

$js = "function hello(ho_ten){ alert('Chào bạn ' + ho_ten); }";

$document->addScriptDeclaration($js);

– Thêm css vào trang web:

• Tham chiếu đến 1 file css:

– Thêm css vào trang web:

• Tham chiếu đến đoạn code css:

– Cấu hình các thẻ meta

• getMetaDatăname) : lấy thông tin các thẻ meta

• setMetaDatăname, value) : gán thông tin cho các thẻ meta

Ví dụ:

$document =& JFactory::getDocument();

$keyword = 'tin tức, thể thao ,văn hóa, giáo dục';

$document->setMetaDatắkeywords', $keywords);

– Đối tượng Pathway cho phép cấu hình thanh

Pathway

– Tạo đối tượng Pathway

global $mainframe;

$pathway =& $mainframe->getPathway();

– Thêm 1 item vào $pathway:

$pathway->addItem($title, [$link]);

– Ví dụ: xử lý tạo pathway khi click vào chủ đề

sách:

global $mainframe;

$pathway =& $mainframe->getPathway();

$pathway->addItem($tencd);

– Xuất thông báo

– Di chuyển đến một url

$mainframe->redirect(url, [noi_dung_thong_bao], [loai_thong_bao]);

• Với loai_thong_bao = message hoặc notice hoặc error

Ví dụ:

global $mainframe;

$url = 'index.php?option=com_khachhang';

$mainframe->redirect($url);

– dùng hàm display của class JEditor

Ví dụ: hiển thị 2 editor có name là editor1 vàeditor2, có width=300, height=200

//truy xuất đối tượng

$editor =& JFactory::getEditor();

//Hiển thị các Editor echo $editor->display('editor1', 'nội dung mặc định của editor 1', '550', '400', '60', '20');

echo $editor->display('editor2', 'nội dung mặc định của editor 2', '550', '400', '60', '20');

– Vì lý do bảo mật nên trong form có sử dụng

editor, sẽ có dòng lệnh

để đảm bảo dữ liệu gửi từ client là của form

– Và trước khi xử lý lưu trữ ở server thì ở client, hàm xử lý biến cố click của nút Save, ta phảithực hiện đoạn code sau:

<?php echo JHTML::_( 'form.token' ); ?>

<?php $editor =& JFactory::getEditor();

echo $editor->save( 'content' ); ?>

– Lấy dữ liệu từ Editor

function save(){

JRequest::checkToken() or jexit( 'Invalid Token' );

//get data from request $post = JRequest::get('post');

$post['content'] = JRequest::getVar('content', '', 'post', 'string', JREQUEST_ALLOWRAW);

//xử lý lưu trữ vào CSDL }

– Mootools là 1 javascript framework

– Sử dụng mootools, ta sẽ dễ dàng hơn trong

việc ứng dụng công nghệ Ajax vào các trangweb trong Joomla

– Bước 1: Copy đoạn code sau vào trang web:

$document =& JFactory::getDocument();

JHTML::_('behavior.mootools');

$js = "window.addEvent('domready', function() {

$( 'form1' ).addEvent('submit', function(e) {

new Event(e).stop();

this.send({ onSuccess: function(response, responseXML) {

//xử lý kết quả phản hồi từ server ở đây

//ví dụ: cập nhật giỏ hàng //$('gio_hang_so_tien').setHTML(response);

}});

});

});";

$document->addScriptDeclaration($js);

– Bước 2: xem lại thẻ form của phần giao diện

Các thuộc tính cần xem lại:

• name: xem có đúng tên form mà ta sử dụng ở đoạn code trước không (có = form1?).

• action: bắt buộc phải có Quy định component sẽ

xử lý yêu cầu và nội dung trả về là text (format=raw) hoặc xml (format=xml)

ví dụ:

action=index.php?option=com_sach&format=raw

Xử lý ở Server

Xử lý ở Client