2010-05-14 142 views
0

我按照R ailscast episode 88實現了一組從屬下拉菜單。 在學生 - >新視圖中,當選擇學生年時,javascript會指出哪些課程可用於該年,並在新的下拉菜單中提供選擇。使用Javascript動態選擇多個複選框選擇

我的JavaScript文件該局是在這裏:

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一起工作。

乾杯

回答