<%= semantic_form_for @modulgruppe do |f| %>
<%= f.inputs do %>


  <div class="row-fluid">
    <%= f.input :name, :wrapper_html=>{:class=>"span12"}%>
  </div>
  <div class="row-fluid">
    <%= f.input :studium_id, :as =>:select, :collection => Studium.all, :wrapper_html=>{:class=>"span4"} %>
    <%= f.input :typ, :collection=>["Pflicht","Vertiefungspflicht","Wahl"], :wrapper_html=>{:class=>"span4"}%>
      <%= f.input :phase, :as=>:select, :collection=>1..3, :wrapper_html=>{:class=>"span4"} %>
      
  </div>


  <div class="row-fluid">
    <%= f.input :desc %>
   
  </div>
  <div class="row-fluid">
  <div class="span12">


<input id="modul" class="autocomplete-checkbox" data-checkboxdiv="modulgruppe_moduls_input" data-checkboxname="modulgruppe[modul_ids][]" data-collection="<%= (Modul.all.map{|l| "{\"value\": \""+l.id.to_s + "\", \"label\": " + "\"" +escape_javascript( l.name.gsub(";",",")) +  "\"}"}.join("; "))%>"> </input>

  <%= f.input :moduls, :as=>:check_boxes, :collection=>@modulgruppe.moduls %>

<script>
$(function(){
$( ".autocomplete-checkbox" ).autocomplete({
   minLength: 0,
   source: [],
   focus: function( event, ui ) {
     $( this ).val( ui.item.label );
     return false;
   },
   select: function( event, ui ) {
     $( this ).val( "" );
     $( "#"+$(this).data("checkboxdiv")).append($("<label>").append($("<div>").attr("class", "checkbox").append($("<input>").attr("type","checkbox").attr("value", ui.item.value).attr("checked","checked").attr("name",$(this).data("checkboxname"))).append(ui.item.label)));
     return false;
   }
}).each(function() {
   $(this).autocomplete("option", "source", $(this).data('collection').split(";").map(function(el){return JSON.parse(el)})
      );
})
.data( "ui-autocomplete" )._renderItem = function( ul, item ) {
      return $( "<li>" )
        .append( "<a>" + item.label +  "</a>" )
        .appendTo( ul );
    };

});
</script>
</div></div>

  <% end %>
<%= f.actions do %>
<%= f.action :submit, :as => :input %>

<% end %>
<% end %>

