使用Javascript动态选择Rails多个复选框

时间:2010-05-14 10:12:29

标签: javascript ruby-on-rails

我已经按照R ailscast episode 88来实现一组依赖的下拉菜单。 在学生 - >新视图中,当选择学生年份时,javascript会确定当年可用的课程,并在新的下拉菜单中提供选择。

我的javascript erb文件在这里:

var courses = new Array();
<% for course in @courses -%>
    <%for year in course.years -%>
        courses.push(new Array(<%= year.year_id%>, '<%=h course.title%>', <%= course.id%>));
    <%end -%>
<% end -%>

function yearSelected() {
    year_id = $('student_year_id').getValue();
    options = $('student_course_ids').options;
    options.length = 1;
    courses.each(function(course) {
        if (course[0] == year_id) {
            options[options.length] = new Option(course[1], course[2]);
        }
    });
    if (options.length == 1) {
        $('course_field').hide();
    } else {
        $('course_field').show();
    }
}

document.observe('dom:loaded', function() {
  yearSelected();
  $('student_year_id').observe('change', yearSelected);
});

我的观点如下:

<% form_for(@student) do |f| %>
  <%= f.error_messages %>

  <p>
    <%= f.label :name %><br />
    <%= f.text_field :name %>
  </p>
  <p>
    <%= f.label :cid, "CID" %><br />
    <%= f.text_field :cid %>
  </p>
  <p>
    <label for="student_year_id">Year:</label>

    <%= collection_select(:student, :year_id, Year.all, :id, :title, {:prompt => true})%>
  </p>

  <p id="course_field">
    <label for="student_course_ids">Course:</label>
    <%= collection_select(:student, :course_ids, Course.find(:all), :id, :title, {:prompt => true}, {:multiple => true})%>

  </p>
  <p>
    <%= f.submit 'Save' %>
  </p>
<% end %>

我想要做的是添加复选框而不是下拉菜单。有什么建议?我之前使用的是this method,但无法使用新的javascript。

干杯

1 个答案:

答案 0 :(得分:0)