Присоединение события onChange для выбора списка в Rails

Question

Я хочу добавить простое событие onChange в список выбора, который у меня есть в Rails.Как мне это сделать?

Это код блока выбора:

= f.select(:question_type_id, QuestionType.all.collect {|qt| [ qt.name, qt.id ]}, { :include_blank => "Please Select a Question Type" })

Предполагается, что событие onChange вызывает функцию fillAnswerNumber (), которая принимает текущее выбранное значение и добавляет несколько параметров к другому.выберите список на основе результата.

edit: я понял, что мне нужно событие onChange на самом деле ...

Answer 1

Используя jquery, я бы привязал событие к клиенту (при загрузке документа).

$("#select_id").onclick(function(){});

Ничего не нужно делать внутри Rails, чтобы заставить это работать, кроме как явно определять идентификатор (но Rails предоставит его для вас, если используются конструкторы форм)

Answer 2

Думаю, я понял это ... благодаря некоторым SO-ответам и нескольким удобным постам в блоге.

Вот что у меня есть. Мой выбор выглядит так:

= f.select(:question_type_id, QuestionType.all.collect {|qt| [ qt.name, qt.id ]}, { :include_blank => "Please Select a Question Type" }, :onchange => "fillAnswerNumber();")

и мой код JavaScript (JQuery) выглядит так:

:javascript
  function fillAnswerNumber(){
    var question_type_name = $("#question_question_type_id :selected").text()
    if(question_type_name == "Single Input"){
      $("#answer_number")
        .find('option')
        .remove()
        .end()
        .append($('<option selected="selected"></option>').val("1").html("1"))
        .append($('<option></option>').val("2").html("2"))
        .append($('<option></option>').val("3").html("3"))
        .append($('<option></option>').val("4").html("4"))
      ;
    }else if(question_type_name == "Multiple Choice"){
       $("#answer_number")
        .find('option')
        .remove()
        .end()
        .append($('<option></option>').val("3").html("3"))
        .append($('<option selected="selected"></option>').val("4").html("4"))
        .append($('<option></option>').val("5").html("5"))
        .append($('<option></option>').val("6").html("6"))
      ;
    }
  }

Answer 3

Полагаю, вам нужно добавить jQuery live для наблюдения за изменением selectbox и отправить запрос ajax для получения результата и заполнения результата в другом selectox.

Псевдокод может выглядеть следующим образом

$('#question_type_id').live('change',function(){
$.ajax({
    url: url_to_fetch_result,
    success: function(responseData) {
      populate your next select depending your resposeData here
    }
});

Преимущество использования live заключается в том, что событие изменения поля выбора срабатывает, даже если вы динамически загружаете поле выбора $ ('question_type_id') позднее.

Может помочь