0

所以我有以下表单部分，允许用户向表中添加值。我对使用 ajax 和 javascript 非常陌生，所以我不完全确定如何去做。但是，一旦输入并提交了值，我希望能够显示已输入的值。目前，我必须重新加载页面才能发生这种情况。我有一个用于 jquery mobile 的 html 部分和一个移动部分。

#_form.html.erb

<% if @workoutexercises[n].exercise_weight.nil? %>
  <%= form_for @workoutexercises[n], :remote => true do |f| %>
    <div class="input-append"><%= f.text_field :exercise_weight, :class => 'submittable input-small' %>
    <%= button_tag(type: 'submit', class: "btn btn-primary", disable_with: 'Processing...') do %>
      <i class="icon-ok icon-white"></i>
    <% end %></div>
  <% end %>
<% else %>
  <%= @workoutexercises[n].exercise_weight %>
<% end %>

#_form.mobile.erb

<% if @workoutexercises[n].exercise_weight.nil? %>
  <%= form_for @workoutexercises[n], :remote => true do |f| %>
    <%= f.label :exercise_weight %>
    <div class="ui-grid-a">
      <div class="ui-block-a"><%= f.text_field :exercise_weight, :class => 'submittable' %></div>
      <div class="ui-block-b"><%= f.submit "Update", "data-role" => "button", "data-theme" => "b" %></div>
    </div>
  <% end %>
<% else %>
  </n>
  Weight: <%= @workoutexercises[n].exercise_weight %>
<% end %>

我目前正在为可提交的 javascript 使用以下内容。

#application.js

$('.submittable').live('change', function() {
  $(this).parents('form:first').submit();
});

提前感谢您提供正确方向的任何提示或线索！干杯

4

1 回答 1

0

在你的锻炼锻炼控制器的适当操作中，在你的 respond_to 块中添加一个新行以允许 JavaScript 响应，如下所示：

respond_to do |format|
   format.html { redirect_to workoutexercises_url }
   format.js // add this line here
end

然后创建一个新的 js 视图模板，例如“update.js.erb”（如果表单提交到更新操作）。还要在同一目录中创建一个新的部分，您可以将其称为 _show.html.erb。

在 update.js.erb 文件中，你会想要这样的东西：

// Render the newly created workout into your table
$('#someTableCell').html("<%= j render ("show") %>");

这将通过 ajax 将包含您新更新的练习的部分 (_show.html.erb) 呈现到您页面上的表格中。

如果您使用不显眼的javascript（即在表单标题中使用remote => true），则不需要问题结束时的javascript。

于 2013-05-18T01:38:35.270 回答