Сейчас на сайте

Сейчас 6 гостей онлайн

Поиск

Tag Cloud

Twitter oAuth и Cod... Баллада о г... сихи лирик... стихи лири... Динамическ... Домашняя с... Использова... Использова... Отправка с... Создание ф... Шепот посл... TinyMCE в Rails стихи лири... Быстрая ра... Пишем собс... Создание с... Установка ... Ностальгия... Москва-Бел... стихи лири... Стихи про п... Крылья сти... Создание п... Простой по... Создание п... Одинокий в... Гражданин ... Несчастный... Сонет стих... Отрезок ст... Врагу не сд... Предчувств... Поиск в ст... Использова... Смерть дву... Использова... Как сделат... Как сделат... Облако тег... Южная сере... Программна... Codeigniter в де... CodeIgniter: фор... проверка в... стихи лири... WEB fetcher(scrappe... Простой Twitt... стихи твор... стихи лири... Побег с Сол... Отправка SMS... MS VSTO 2007/Infusio... Установка R... Степные тр... моя любовь. К твоим оз... Сомкнуть л... чтоб отдат... вот – вот ... еще не расс... Снег тишина и лу... и мира пово... что мой пос... Лишь ты. И т... ты любима ты чиста. Экспорт да... Я пью до дн... что нам теп... -Наш первый... Социальные... Социальные... Спит в можж... Воздух про... Стены рожденные ... эхо умрет. Неотправле... стихи лири... Он порезал... Боясь шагн... не осталос... Услышать з... Программир...

Создание простого админ интерфейса с использованием CodeIgniter PDF Печать E-mail
31.05.2011 15:02

Часто веб-разработчику приходиться создавать различные админ интерфейсы, как правило, с базовой архитектурой - CRUD ((Create Read Update Delete) . Здесь мы покажем как это делается с помощью CodeIgniter.Далее описываются пошаговые инструкции и код к ним.

1. Поскольку проект учебный, то нам придется создать базу данных и настроить сам проект ( в реальном приложении все это уже должно быть ). Итак, создаем базу данных “admins” с таблицей “users”:

CREATE TABLE `users` (

`id` int(11) NOT NULL AUTO_INCREMENT,

`first_name` varchar(45) DEFAULT NULL,

`last_name` varchar(45) DEFAULT NULL,

`email` varchar(255) DEFAULT NULL,

PRIMARY KEY (`id`)

) ENGINE=InnoDB AUTO_INCREMENT=2 DEFAULT CHARSET=latin1;

 

1. Далее редактированием файл/system/application/config/database.php”

$active_group = "default";

$active_record = TRUE;

$db['default']['hostname'] = "localhost";

$db['default']['username'] = "dbuser";

$db['default']['password'] = "mypassword";

$db['default']['database'] = "admins";//база данных

$db['default']['dbdriver'] = "mysql";

$db['default']['dbprefix'] = "";

$db['default']['pconnect'] = TRUE;

$db['default']['db_debug'] = TRUE;

$db['default']['cache_on'] = FALSE;

$db['default']['cachedir'] = "";

$db['default']['char_set'] = "utf8";

$db['default']['dbcollat'] = "utf8_general_ci";

2. Другой правим конфигурационный файл “/system/application/config/config.php

$config['base_url'] = "http://127.0.0.1/admins/";

Здесь у нас путь к нашему приложению на сервере, еще одна настройка, в другом месте./system/application/config/routes.php . Устанавливаем наш контроллер по умолчанию:

$route['default_controller'] = "users";

3. Теперь мы должны создать модель для нашей таблицы «users» .Модель работает с базой данных и как с абстрактной структурой, что несомненно, очень удобно. Он размещается в папке /system/application/models/”. Вот исходный код нашего класса:

<?php

class UserModel extends Model {

function User(){

//конструктор класса который наследует все методы родительского //класса и загружает поддержку работы для баз данных

parent::Model();

$this->load->database();

}

function list_all(){

//метод для сортировки и отображения данных таблицы

$this->db->order_by('desc');

return $this->db->get(‘users’);

}

function count_all(){

//подсчет общего колиечства записей в таблице

return $this->db->count_all(‘users’);

}

function get_paged_list($limit = 10, $offset = 0){

//получение лимитированного количества данных

$this->db->order_by('id','desc');

return $this->db->get(‘users’, $limit, $offset);

}

function get_by_id($id){

//получение данных из таблицы по ID записи

$this->db->where('id', $id);

return $this->db->get(‘users’);

}

function add($user){

//добавление записи в таблицу

$this->db->insert(‘users’, $user);

return $this->db->insert_id();

}

function update($id, $user){

//обновление записи в таблице

$this->db->where('id', $id);

$this->db->update(‘users’, $user);

}

function delete($id){

//удаление записи из таблицы

$this->db->where('id', $id);

$this->db->delete(‘users’);

}

}

?>

4. Сейчас можем перейти к разработке непосредственно к класса контроллера, который будет обрабатывать поступающие запросы. Он располагается в “/system/application/controllers/”

 

<?php

class User extends Controller {

// количество записей на странице

private $limit = 10;

function User(){

//конструктор класса с инициализацией необходимых параметров

parent::Controller();

// загрузка библиотек

$this->load->library(array('table','validation'));

// загрузка helper

$this->load->helper('url');

// загрузка класса модели

$this->load->model('UserModel','',TRUE);

}

function index($offset = 0){

// устанавливаем смещение

$uri_segment = 3;

$offset = $this->uri->segment($uri_segment);

// загрузка данных

$users = $this->UserModel->get_paged_list($this->limit, $offset)->result();

// генерируем pagination

$this->load->library('pagination');

$config['base_url'] = site_url('user/index/');

$config['total_rows'] = $this->userModel->count_all();

$config['per_page'] = $this->limit;

$config['uri_segment'] = $uri_segment;

$this->pagination->initialize($config);

$data['pagination'] = $this->pagination->create_links();

// генерируем таблицу

$this->load->library('table');

$this->table->set_empty("&nbsp;");

$this->table->set_heading('No', 'First Name', 'Last Name', 'E-mail', 'Actions');

$i = 0 + $offset;

foreach ($users as $user){

$this->table->add_row(++$i, $user->first_name, $user->last_name, $user->email, anchor('user/view/'.$user->id,'view',array('class'=>'view')).' '.

anchor('user/update/'.$user->id,'update',array('class'=>'update')).' 'anchor('user/delete/'.$user->id,'delete'

,array('class'=>'delete','onclick'=>"return confirm('Are you sure want to delete this user?')"))

);

}

$data['table'] = $this->table->generate();

// загружаем шаблон вида

$this->load->view('UserList', $data);

}

function add(){

// настройка правил валидаторов

$this->_set_fields();

// общие свойства метода

$data['title'] = 'Add new user';

$data['message'] = '';

$data['action'] = site_url('user/adduser');

$data['link_back'] = anchor('user/index/','Back to list of users',array('class'=>'back'));

// загружаем шаблон вида

$this->load->view('UserEdit', $data);

}

function adduser(){

// настройка проверки ввода

$data['title'] = 'Add new user';

$data['action'] = site_url('user/adduser');

$data['link_back'] = anchor('user/index/','Back to list of users',array('class'=>'back'));

// загружаем шаблон вида

$this->_set_fields();

$this->_set_rules();

// запуск валидатора

if ($this->validation->run() == FALSE){

$data['message'] = '';

}else{

// сохранение данных

user = array('first_name' => $this->input->post('first_name'),

'last_name' => $this->input->post('last_name'),

'email' => $this->input->post('email')

);

$id = $this->UserModel->save($user);

// установка имени формы ввода ="id"

$this->validation->id = $id;

// Сообщение пользователю

$data['message'] = '<div class="success">add new user success</div>';

}

// загружаем шаблон вида

$this->load->view('UserEdit', $data);

}

function view($id){

// общие свойства метода

$data['title'] = 'user Details';

$data['link_back'] = anchor('user/index/','Back to list of users',array('class'=>'back'));

// получение свойств пользователя

$data['user'] = $this->UserModel->get_by_id($id)->row();

// загружаем шаблон вида

$this->load->view('UserView', $data);

}

function update($id){

// настройка проверки ввода

$this->_set_fields();

// предустановленные значения формы

$user = $this->UserModel->get_by_id($id)->row();

$this->validation->id = $id;

$this->validation->first_name = $user->first_name;

$this->validation->last_name = $user->last_name;

$this->validation->email = $user->email;

// общие свойства метода

$data['title'] = 'Update User';

$data['message'] = '';

$data['action'] = site_url('user/updateuser');

$data['link_back'] = anchor('user/index/','Back to list of users',array('class'=>'back'));

// загружаем шаблон вида

$this->load->view('UserEdit', $data);

}

function updateuser(){

// общие свойства метода

$data['title'] = 'Update User';

$data['action'] = site_url('user/updateuser');

$data['link_back'] = anchor('user/index/','Back to list of users',array('class'=>'back'));

// настройка проверки ввода

$this->_set_fields();

$this->_set_rules();

// run validation

if ($this->validation->run() == FALSE){

$data['message'] = '';

}else{

// save data

$id = $this->input->post('id');

$ user = array('first_name' => $this->input->post('first_name'),

'last_name' => $this->input->post('last_name'),

'email' => $this->input->post('email')

);

$this->UserModel->update($id,$user);

// сообщение пользователю

$data['message'] = '<div class="success">Update user success</div>';

}

// загрузка шаблона вида

$this->load->view('UserEdit', $data);

}

function delete($id){

// delete user

$this->UserModel->delete($id);

//перенаправление на главную страницу

redirect('user/index/','refresh');

}

//метод устанавливающий поля для проверки ввода

function _set_fields(){

$fields['id'] = 'id';

$fields['first_name'] = 'first_name';

$fields['last_name'] = 'first_name';

$fields['email'] = 'email';

$this->validation->set_fields($fields);

}

// метод поля для обработки проверки ввода

function _set_rules(){

$rules[''first_name''] = 'trim|required';

$rules['last_name'] = 'trim|required';

$rules['email'] = 'trim|required';

$this->validation->set_rules($rules);

$this->validation->set_message('required', '* required');

$this->validation->set_message('isset', '* required');

$this->validation->set_error_delimiters('<p class="error">', '</p>');

}

}

?>

5. Нам осталось создать файлы шаблонов для отображения данных. Первым нужно описать файл стилей (CSS),который будет в папке “style/style.css” .Там же размещаем папку images(“style/images”) для файлов картинок стилей.

body {

font-family:tahoma;

padding:0px;

margin:0px;

background:#f5f5f5

}

div.content {

padding:10px 20px;

}

div.content h1 {

font-size:18pt;

border-bottom:5px solid #a00;

padding:0px;

margin:10px 0px 20px;

width:80%;

}

div.content div.data table {

border:2px solid #000;

background:#fff;

width:80%;

}

div.content div.data table td {

font-size:10pt;

padding:5px 10px;

border-bottom:1px solid #ddd;

text-align: left;

}

div.content div.data table th {

text-align: left;

font-size: 8pt;

padding: 10px 10px 7px;

text-transform: uppercase;

color: #fff;

background: url('/images/head.gif') left -5px repeat-x;

}

div.paging {

font-size: 9pt;

margin:5px 0px;

}

div.paging a {

color:#900;

text-transform: uppercase;

text-decoration: none;

}

div.paging a:hover {

color:#c00;

}

div.paging b {

color:#900;

}

div.success {

font-size:14pt;

background: url('/images/accept.png') left 5px no-repeat;

padding:0px;

padding-left:20px;

margin:0px 0px 10px;

color:#060;

width:80%;

}

a.update, a.delete, a.add, a.view, a.back {

font-size: 9pt;

color:#900;

font-wight:bold;

padding-left:20px;

text-decoration: none;

}

a.update {

background: url('/images/update.png') left center no-repeat;

}

a.delete {

background: url('/images/delete.png') left center no-repeat;

}

a.add {

background: url('/images/add.png') left center no-repeat;

}

a.view {

background: url('/images/view.png') left center no-repeat;

}

a.back {

background: url('/images/prev.gif') left center no-repeat;

}

a.update:hover, a.delete:hover, a.add:hover, a.view:hover {

color:#000;

}

input.text {

border:2px solid #aaa;

}

.error {

background: #FBE6F2 none repeat scroll 0 0;

border: 1px solid #D893A1;

color: #333333;

margin: 5px 0 0;

padding: 5px;

font-size: 10px;

font-family: Lucida Grande,Verdana,Geneva,Sans-serif;

}

Теперь можно перейти к самим шаблонам. Все они должны быть в папке “/system/application/views”.

Первым из шаблонов виду будет у нас файл “UserList.php. Он будет главной страницей нашего приложения. В нем загружается файл стиля,paginator и таблица, отображающая данные. Кроме того, есть ссылка на другой элемент интерфейса – добавление нового пользователя:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>Admin </title>

<link href="/<?php echo base_url(); ?>style/style.css" rel="stylesheet" type="text/css" />

</head>

<body>

<div class="content">

<h1>Admin Area</h1>

<div class="paging"><?php echo $pagination; ?></div>

<div class="data"><?php echo $table; ?></div>

<br />

<?php echo anchor('user/add/','add new data',array('class'=>'add')); ?>

</div>

</body>

</html>

Второй шаблон служит для редактирования/добавления нового пользователя. Файл называется “UserEdit.php” :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>Admin </title>

<link href="/<?php echo base_url(); ?>style/style.css" rel="stylesheet" type="text/css" />

<body>

<div class="content">

<h1><?php echo $title; ?></h1>

<?php echo $message; ?>

<form method="post" action="<?php echo $action; ?>">

<div class="data">

<table>

<tr>

<td width="30%">ID</td>

<td><input type="text" name="id" disabled="disable" class="text" value="<?php echo $this->validation->id; ?>"/></td>

<input type="hidden" name="id" value="<?php echo $this->validation->id; ?>"/>

</tr>

<tr>

<td valign="top">First Name<span style="color:red;">*</span></td>

<td><input type="text" name="first_name" class="text" value="<?php echo $this->validation->first_name; ?>"/>

<?php echo $this->validation->first_name_error; ?></td>

</tr>

<tr>

<td valign="top">Last Name<span style="color:red;">*</span></td>

<td><input type="text" name="last_name" class="text" value="<?php echo $this->validation->last_name; ?>"/>

<?php echo $this->validation->last_name_error; ?></td>

</tr>

<td valign="top">Email <span style="color:red;">*</span></td>

<td><input type="text" name="name" class="text" value="<?php echo $this->validation->email; ?>"/>

<?php echo $this->validation->email _error; ?></td>

</tr>

<tr>

<td>&nbsp;</td>

<td><input type="submit" value="Save"/></td>

</tr>

</table>

</div>

</form>

<br />

<?php echo $link_back; ?>

</div>

</body>

</html>

И на конец, последний файлuserView.php отображает данные о пользователе.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>Admin </title>

<link href="/<?php echo base_url(); ?>style/style.css" rel="stylesheet" type="text/css" />

</head>

<body>

<div class="content">

<h1><?php echo $title; ?></h1>

<div class="data">

<table>

<tr>

<td width="30%">ID</td>

<td><?php echo $user->id; ?></td>

</tr>

<tr>

<td valign="top">First Name</td>

<td><?php echo $user->first_name; ?></td>

</tr>

<tr>

<td valign="top">Last Name</td>

<td><?php echo $user->last_name; ?></td>

</tr>

<tr>

<td valign="top">E-mail</td>

<td><?php echo $user->email ; ?></td>

</tr>

</table>

</div>

<br />

<?php echo $link_back; ?>

</div>

</body>

</html>

Как видим, получился простой, но при этом вполне функциональный интерфейс .Далее можно его совершенствовать и усложнять, что также не составит никаких трудностей. :-)


0
 

Добавить комментарий


Защитный код
Обновить