В данной статье рассмотрим один из вариантов использования технологии Ajax в фреймворке CodeIgniter.
Допустим, у нас уже выводится таблица с информацией об автомобилях. Наша задача – сделать ajax-фильтрацию, например, по году выпуска автомобиля.
Итак, у нас есть:
1. Таблица в БД ex_cars:
id name year price
1 Ваз-2109 2010 8000
2 Ланос 2009 9000
3 Toyota 2010 30000
4 BMW 2009 40000
5 Audi 2010 50000
2. Модель Car_model. И метод модели get_all(), который получает данные из таблицы ex_cars по условию или без условия, т.е. все данные.
class Car_model extends Model {
protected $table = 'ex_cars';
function get_all($where='') {
$this->db->select('*');
$this->db->from($this->table);
if(!empty($where))
{
$this->db->where($where);
}
return $this->db->get()->result();
}
}
3. Контроллер с именем Ajax. В контроллере есть конструктор, в нем мы подключаем нашу модель ‘car_model’. Еще есть метод index(). В нем с помощью метода get_all модели car_model мы получаем все данные из таблицы ex_cars и затем отсылаем их в отображение cars. Которое, в свою очередь выводится в основное отображение для всех моих примеров – main. Обратите внимание на то, что наш контроллер Ajax расширяет класс MY_Controller. Это мой суперконтроллер, от которого я наследую все контроллеры. Вы можете расширять стандартный контроллер Controller. В моем же суперконтроллере сейчас определена переменная public $data; и $this->data['base_url'] = $this->config->item(‘base_url’);
class MY_Controller extends Controller {
public $data; //хранит массив данных, передаваемых во view
function MY_Controller() {
parent::Controller();
$this->data = array();
$this->data['base_url'] = $this->config->item('base_url');
}
}
class Ajax extends MY_Controller {
function Ajax()
{
parent::MY_Controller();
$this->load->model('car_model');
}
function index()
{
$this->data['results'] = $this->car_model->get_all();
$this->data['inner_view'] = "cars";
$this->load->view('main', $this->data);
}
}
4. Отображение cars.php. В нем мы выводим полученные данные в виде таблицы.
<table>
<tr>
<th>Марка</th>
<th>Год</th>
<th>Цена</th>
</tr>
<?foreach($results as $res):?>
<tr>
<td><?=$res->name?></td>
<td><?=$res->year?></td>
<td><?=$res->price?></td>
</tr>
<?endforeach;?>
</table>
Теперь распишем по пунктам, что нам надо сделать:
1. Фильтрация по году выпуска, значит надо добавить select со списком годов и пунктом «Все».
2. Написать на jQuery обработчик на изменение года в данном select.
3. В данном обработчике получить год, который был выбран и отправить ajax-запрос на сервер с параметром «год выпуска».
4. В контроллере Ajax написать метод, который будет обрабатывать наш ajax-запрос.
Т.е. получать все автомобили с указанным годом выпуска и возвращать их в виде таблицы.