Главная > CodeIgniter > Ajax-фильтрация. CodeIgniter, jQuery. Часть 1.

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-запрос.

Т.е. получать все автомобили с указанным годом выпуска и возвращать их в виде таблицы.

Во второй части статьи рассмотрим и реализуем поставленные задачи. Спасибо за внимание.



  1. Комментариев пока нет.
  1. Трекбеков пока нет.