Динамический выбор с использованием Rails 3 и jQuery

Question

Я хочу динамически заполнить выпадающий список с помощью jQuery.Я пытаюсь вызвать действие контроллера, но я не знаю, как с объектом collection_select.Я пробовал: input_html, но действие контроллера никогда не вызывается.Я получаю ошибку синтаксического анализа в моем отладчике javascript, потому что javascript пытается проанализировать всю страницу просмотра.

Код в представлении:

<div id="ssmodels">
  <%= collection_select :ssmodel, :ssmodel, @ssmodels, :id, :name, :input_html => {:rel => "/phrases/update_submodel_select" }  %>
</div>

<div id="ssmodel_sssubmodel">
  <%= collection_select :ssmodel, :sssubmodel, @sssubmodels, :id, :name %>
</div>

Javascript в Application.js:

$.fn.subSelectWithAjax = function() {
  var that = this;
  this.change(function() {
    $.post(that.attr('rel'), {id: that.val()}, null, "script");
    return false;
  })
};

$(document).ready(function(){$("#ssmodels").subSelectWithAjax();
})


$(document).ready(function(){$("#ssmodel_sssubmodel").subSelectWithAjax();
})

Пожалуйста, помогите.

Answer 1

Я думаю, что самый ненавязчивый способ - это, если хук js не зависит от того, как выбранное значение помещается в URL для вызова.

Итак, я решил эту общую проблему так:

application.js: в теле вашей функции livehook / documentready:

$('select[data-observe-url]').change(function() {
     var selected = $(this).find(':selected').val();
     var url = $(this).attr('data-observe-url').replace('%(selected)',selected)
     $.get(url)
     return false;
});

, а затем ваш html:

<select id="signup_course_id" name="signup[course_id]" data-observe-url="http://localhost:3000/courses/%(selected)/select" >
<option value="">Choose Class</option>
<option value="1">excel 2007</option>
</select>

, сгенерированный с помощью formtastic:

form.input :course, :collection => Course.all, :include_blank => 'Choose Class', 
      :input_html => { 'data-observe-url' => select_course_url('%(selected)') }

Думайте о% (выбранном) как о параметре формата строки в URL, который jquery заменяет выбранным значением, используя $(это) .find ( ': выбрано')

Answer 2

Взгляните на этот урок. Это в основном позволяет вам предварительно заполнить одно поле выбора. Когда в этом поле запускается событие .change(), оно отправляет запрос на сервер с выбранным значением в качестве параметра. Ответ затем используется для заполнения второго поля выбора.

http://www.codecapers.com/post/Dynamic-Select-Lists-with-MVC-and-jQuery.aspx

У нас был довольно хороший успех с этим методом. Если это не работает для вас, вы всегда можете сохранить все результаты в одном объекте JSON и просто выполнить свою логику через это.