Question

我在YouTube / Google上观看了许多教程，并在此处阅读了许多问题，但是我不明白如何使Ajax form_正常工作。我有两个选择，这是我的过滤器。我选择了一个班次和一条生产线，然后我想要一张表，列出所有在该班次期间在该生产线上工作的工人。然后，我需要选择所有与该行相关的培训。如果我使用参数和函数使其“旧/易用”，那么我可以做到，但是现在我希望使用ajax将其放在单个页面上，而无需任何重定向/重新加载。另外，我实际上不想有两个提交按钮。我希望过滤器选择自动更新第二个表单。我得出的结论是，如果我使用form_with做到这一点应该很简单，因为我无法使用任何js。目前，我的代码可能一团糟，但希望您能为我提供帮助。

add_worker_tm.js.erb

$("[data-placeholder~=tform]").html("<%= j render "tform" %>");

add_worker_tm.html.erb

    <% provide(:title, "Mitarbeiter hinzufügen") %>
<div class="row">
  <div class="col-md-6 col-md-offset-3">
    <%= render "filter" %>
    <br><br>
    <%= render "tform" %>
  </div>
</div>

_filter.html.erb

<h1>Mitarbeiter hinzufügen</h1>
    <%= form_with url: add_worker_tm_trainings_path do |f| %>
      <%= f.label :schicht %>
      <%= f.collection_select :shift, Shift.all, :id, :name %>
      <%= f.label :linie %>
      <%= f.collection_select :line, Line.all, :id, :name %>
      <%= f.submit :submit %>
    <% end %>

_tform.html.erb

<div id="tform">
<%= simple_form_for(@trainingmem = Trainingsmembership.new, url: add_worker_tm_trainings_path) do |f| %>
  <div style="overflow: auto; height: 350px">
    <table>
      <tr>
        <th style="width: 25px"></th>
        <th style="width: 200px"><%= sort_link "name" %></th>
        <th style="width: 125px"><%= sort_link "position" %></th>
        <th style="width: 75px"><%= sort_link "Schicht" %></th>
        <th style="width: 100px"><%= sort_link "linie" %></th>
      </tr>
      <% @workerall.each do |worker| %>
        <tr>
          <td><%= check_box_tag "worker_ids[worker_ids][]", worker.id %></td>
          <td><%= worker.name %></td>
          <td><%= Position.find(worker.position_id).name %></td>
          <td><%= Shift.find(worker.shift_id).name %></td>
          <td><% worker.line_ids.each do |line| %>
              <%= Line.find(line).name %>
            <% end %></td>
        </tr>
      <% end %>
    </table>
  </div>
  <br><br>
  <%= f.input :training_id, collection: @trainings, label_method: :name, value_method: :id, label: 'Training:', include_blank: false %>
  <%= f.input :duration, label: 'Gültigkeit:' %>
  <%= f.input :date, :as => :string, :input_html => { data: {behaviour: "datepicker"}}, label: 'Prüfungstermin:' %>
  <!--#%= f.input :worker_id, collection: Worker.all, label_method: :name, value_method: :id, label: 'Mitarbeiter', include_blank: false, input_html: { multiple: false } %>-->
  <%= f.input :comment, as: :text, label: 'Bemerkung:' %>
  <%= f.input :attachement, as: :file, label: 'PDF-Protokoll:' %>
  <%= f.submit "Training bearbeiten", class: "btn btn-primary" %>
<% end %>
<script type="text/javascript">
    $('#micropost_picture').bind('change', function() {
        var size_in_megabytes = this.files[0].size/1024/1024;
        if (size_in_megabytes > 5) {
            alert('Maximum file size is 5MB. Please choose a smaller file.');
        }
    });
</script>
<script type="text/javascript">
    $('[data-behaviour~=datepicker]').datepicker({
        "format": "dd.mm.yyyy",
        "weekStart": 1,
        "autoclose": true
    });
</script>
</div>

trainings_controller

    def add_worker_tm
        @worker = Worker.new
        @workers = Worker.order("#{sort_column} #{sort_direction}")
        @workerall = Worker.all
        @trainings = Training.all
      end

      def addworkers_tm
        @workerall = Worker.order("#{sort_column} #{sort_direction}")
if params[:worker_ids].nil?
      flash[:error] = "Kein Mitarbeiter ausgewählt!"
      redirect_to add_worker_tm_trainings_path
      return
      end        
       @ws = params[:worker_ids].require('worker_ids')
        @trainings = Training.all
        @ws.each do |w|
          @tm = Trainingsmembership.new(tm_params)
          @tm.worker_id = w
          if @tm.save
            flash[:success] = "Mitarbeiter eingefügt"
            #redirect_to root_path
          else
            @tm.errors
            flash[:error] = "Fehler"
            render 'add_worker_tm'
            return
          end
        end
        redirect_to root_path
    end

路线

resources :trainings do
    collection do
      get 'add_worker_tm', to: 'trainings#add_worker_tm'
      post 'add_worker_tm', to: 'trainings#addworkers_tm'
    end
  end

如果我尝试提交我的过滤器，我有一个POST，但是我不知道如何更改控制器中的内容并将其与ajax结合使用。第二种形式显示当前我所有的工人和培训，而不是经过过滤的工人和培训。

编辑：

我使用了局部函数，所以我只需要更新局部函数。我仍然无法弄清楚我与ajax控制器的关系以及我缺少的js。

带有ajax和rails的过滤器表单选择

0 个答案: