Question

我正在一个网站上工作，这可以让你做出愿望。我希望用户能够从网站的任何地方创建一个愿望，这就是为什么我想采用jquery / ajax方法。

我在顶栏上有一个链接，它启用了一个模态：

_header.html.erb（模态部分）

<div id="make_wish" class="modal hide fade" tabindex="1" role="dialog" aria-labelledby="make_wish" aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="make_wish">Make a wish</h3>
  </div>
  <div id="linkpreview">
    <div class="modal-body">
        <form>
          <label for="url">Retrieve item</label>
          <input id="url" type="text" placeholder="http://">
        </form>
    </div>
    <div class="modal-footer">
      <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
      <%= link_to "Get info", new_item_path, id: "urlb", class: "btn btn-primary", remote: true %>
    </div>
  </div>
</div>

单击“获取信息”按钮后，将调用new.js.erb：

    $("#linkpreview").hide().after('<%= j render("item_fields") %>');

这将呈现：_item_fields.html.erb

<div class="modal-body">
    <%= form_for(@item, html: { multipart: true }) do |f| %>
        <%= render 'fields', f: f %>
</div>
<div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    <%= f.submit "Wish", class: "btn btn-primary" %>
    <% end %>
</div>

现在，当我填写表单并点击提交按钮时，没有任何反应。

我是rails，jquery和ajax的新手，因此非常感谢任何帮助！

**编辑**

items_controller.rb

def new
    if signed_in?
        @item = Item.new
        @user = current_user
    else
        render 'users/new'
    end
end

def create
    @list = current_user.lists.find(params[:list_id])
    @item = Item.create!(params[:item])
    @item.wishes.build(list_id: @list.id)
    if @item.save
      flash[:success] = "Item created!"
      redirect_to @item
    else
      render 'new'
    end
end

Answer 1

问题是html格式错误。 form_for应该在<div class="modal-body">

之前

<%= form_for(@item, html: { multipart: true }) do |f| %>
    <div class="modal-body">
        <%= render 'fields', f: f %>
    </div>
    <div class="modal-footer">
        <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
        <%= f.submit "Wish", class: "btn btn-primary" %>
    </div>
<% end %>

表格未在ajax部分渲染后提交

1 个答案: