Rails AJAX - получение раскрывающегося списка для заполнения таблицы

Я пытаюсь получить выбор из раскрывающегося списка для заполнения таблицы на той же странице, используя AJAX, чтобы изменения отображались без обновления страницы. Я дошел до разработки кода для удаленного вызова и добавления настраиваемого действия в контроллер, но я не знаю, как получить возвращенную информацию в таблицу, которую я получил. На данный момент таблица просто перебирает все проекты, но я хочу, чтобы она отображала информацию только для одного выбранного проекта.

Что мне нужно написать в файле JS (rjs?), чтобы заставить его обрабатывать возвращенную информацию, и какие изменения мне нужно внести в существующую таблицу, чтобы убедиться, что она отображает правильную информацию?

Выпадающий список (с вызовом AJAX):

<%= collection_select :id, Project.all, :id, :name, :onchange => remote_function(:url=>{:action => 'populate_projects'}) %>

Действие контроллера:

 def populate_projects
    @project = Project.find(params[:id])
 end

И существующая таблица:

<table>
  <tr>
    <th>Name</th>
    <th>Category</th>
    <th>Budget</th>
    <th>Deadline</th>
    <th>Company ID</th>
    <th></th>
    <th></th>
    <th></th>
  </tr>

<% @projects.each do |project| %>
  <tr>
    <td><%= project.name %></td>
    <td><%= project.category %></td>
    <td><%= number_to_currency(project.budget, :unit => "&pound;") %></td>
    <td><%= project.deadline.strftime("%A, %d %B %Y") %></td>
    <td><%= project.company_id %></td>
    <td><%= link_to 'More', project %></td>
    <td><%= link_to 'Edit', edit_project_path(project) %></td>
    <td><%= link_to 'Delete', project, confirm: 'Are you sure?', method: :delete %></td>
  </tr>
<% end %>
</table>

ruby-on-rails drop-down-menu ajax html-table populate
person ecs    schedule 04.07.2012    source источник

Ответы (3)


arrow_upward
4
arrow_downward

Предположим, вы используете jquery

<%= collection_select :project, :id, Project.all, :id, :name, {}, {:onchange => '$.get("/populate_projects")'} %>

затем в вашем контроллере

def populate_projects
  @project = Project.find(params[:id])
  respond_to do |format|
    ...
    format.js { render 'populate_projects', :formats => [:js] }
    ...
  end
end

наконец, создайте populate_projects.js.erb и напишите любой сценарий содержимого таблицы изменений. @project доступен в этом скрипте.

person raymondralibi    schedule 04.07.2012
comment
К сожалению, это не в форме - это отдельное раскрывающееся окно в представлении индекса - как мне заставить это работать без необходимости иметь его в форме или иметь кнопку отправки? Извините, я новичок в рельсах, поэтому вам, возможно, придется объяснить это для меня! Спасибо! - person ecs; 04.07.2012
comment
В конечном счете, я пытаюсь добиться того, чтобы в раскрывающемся меню отображался список всех текущих проектов, чтобы пользователь мог щелкнуть «выбрать проект», и он помещает идентификатор проекта в сеанс, поэтому только задачи и т. д. относятся к этот проект показан на следующих страницах. Итак, могу ли я создать форму, которая будет вызывать настраиваемое действие при отправке, чтобы поместить в сеанс идентификатор проекта, выбранного в раскрывающемся списке? Если бы вы могли дать мне некоторое представление о том, как это сделать, это было бы здорово! У меня уже есть пользовательское действие select_project, но я не могу связать его с раскрывающимся списком. - person ecs; 04.07.2012

arrow_upward
0
arrow_downward

Создайте один партиал _project.html.erb и отобразите этот партиал на индексной странице. <%= render @projects %> При смене проекта просто визуализируйте частичный объект проекта и обновите страницу с помощью rjs.

person Amar    schedule 04.07.2012
comment
на данный момент я получаю сообщение об ошибке: неопределенный метод `remote_function' - есть идеи, почему? Как еще я могу сделать удаленный вызов ajax при изменении значения раскрывающегося списка? Спасибо! - person ecs; 04.07.2012
comment
Ах, я только что посмотрел - удаленная_функция была удалена в рельсах 3 - как еще я мог бы добиться того же самого!? - person ecs; 04.07.2012
comment
Просто используя событие jquery onchange, отправьте запрос ajax в ответ, просто установите действие html.on rails format.js{render :partial=>@project} - person Amar; 04.07.2012
comment
Чтобы составить список задач на основе проекта, вы можете просмотреть github.com/amardaxini/dynamic_report. - person Amar; 04.07.2012

arrow_upward
0
arrow_downward

В файле js (RJS) вам нужно вызвать частичный файл HTML, и в этом файле есть таблицы, которые вы показали здесь в своем вопросе.

Я надеюсь, это поможет вам.

Спасибо.

person urjit on rails    schedule 04.07.2012