javascript - Rails: Submit html table content in form to controller -
i have trouble rails formular.
i have form create "projects".
project form
<%= bootstrap_form_for(@project) |f| %> ... <div class="container-fluid"> <%= f.static_control label:"vordefinierte aufgaben" %> <div class="actions form-group nopadding"> <div class="center-block"> <%=link_to "", data: {toggle:"modal", target:".newtask-modal"} , class: "btn btn-success center-block btn-sidebar-ok", id: "singlebutton" do%> <i> <span class="glyphicon glyphicon-plus pull-left btn-sidebar-icon"></span>neue aufgabe hinzufügen </i> <% end %> </div> </div> <div class="task-table"> <%=render 'tasks/table'%> </div> <% end %> </div> ... <!-- task modal create new task --> <%=render 'tasks/newtaskmodal' %> <% end %> <!-- button --> <div class="actions form-group"> <div class="center-block"> <%= button_tag( type: 'submit', class: "btn btn-success center-block btn-sidebar-ok", id: "singlebutton") do%> <i> <span class="glyphicon glyphicon-ok pull-left"></span>projekt anlegen </i> <% end %> </div> </div>
within form have table shows created tasks , button open bootstrap modal. modal contains new form create task.
task form within modal
<%= bootstrap_form_tag() |f| %> <div class="col-sm-8"> <%= f.text_field :task_title, label: "titel", placeholder: "betreff", icon: "pencil",wrapper: { class: 'icon-addon addon-md'} %> </div> <div class="col-sm-4"> <%= f.number_field :task_in_min, label: "arbeitszeit in min", placeholder: "bsp.: 25", icon: "time", wrapper: { class: 'icon-addon addon-md'}%> </div> <div class="col-sm-12"> <%= f.text_area :task_description, label: "beschreibung*", placeholder: "aufgabenbeschreibung", icon: "pencil", rows: 10, wrapper: { class: 'icon-addon addon-md'}%> </div> <%= button_tag( type: 'button', id:"tasksubmit", class: "btn btn-success center-block btn-sidebar-ok") %> <i > <span class="glyphicon glyphicon-ok pull-left btn-sidebar-icon"></span> speichern </i> <% end %> <% end %>
if click "tasksubmit" javascript put task (title, description, min) table within project form. js create new table row task content.
javascript
//take data task form , @ new task element task table in project form $(function tasksubmitfunction(){ $('#tasksubmit').click(function(){ var task_title = $('#task_title').val(); var task_description = $('#task_description').val(); var task_in_min = $('#task_in_min').val(); //remove spaces title var id = task_title.replace(/ /g,''); $('#tasktable tr:last').after('<tr id="task_'+id+'"> <td>'+task_title+'</td> <td>'+task_description+'</td><td>'+task_in_min+'</td><td> <span class="pull-right"><span data-toggle="tooltip" data-placement="right" data-original-title="löschen"><button class="btn btn-sm btn-danger btn-colored delete-position" id="'+id+'"name="button" type="button" task="'+task_title+'"><i><span class="glyphicon glyphicon-remove"/></i></button></span></span></td></tr>'); $('#tasktable').after('<input type="hidden" id="1" name="1" value="'+task_title+'" />'); $('#task_title').val(''); $('#task_description').val(''); $('#task_in_min').val(''); //initialize task delete $(function taskdeletefunction(){ $('#'+id).click(function(){ var task_title = $(this).attr('task'); if (confirm("soll die aufgabe wirklich gelöscht werden?")) { $('#'+id).remove(); } return false; }); }); }); });
what want submit these table elements project controller create project , necessary tasks activerecords. possible? how can this? maybe create hidden field every table element submit project form? every table element consists of 3 values... how can this?
do have idea?
best regards
why not use 3 hidden fields (one each value)? straightforward , easy access in params hash.
Comments
Post a Comment