Ajax-фильтрация. CodeIgniter, jQuery. Часть 1.
В данной статье рассмотрим один из вариантов использования технологии Ajax в фреймворке CodeIgniter.
Допустим, у нас уже выводится таблица с информацией об автомобилях. Наша задача – сделать ajax-фильтрацию, например, по году выпуска автомобиля.
Вот ссылка на рабочий пример: 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-запрос.
Т.е. получать все автомобили с указанным годом выпуска и возвращать их в виде таблицы.
Во второй части статьи рассмотрим и реализуем поставленные задачи. Спасибо за внимание.