单击链接时通过呈现部分将部分添加到表单 [英] Add section to form by rendering a partial when link is clicked

问题描述

更新 3:

对于阅读本文的任何人，这就是它在下面的更新 2 中没有按预期工作的原因:将局部变量传递给在视图加载后呈现的局部变量

For anyone who reads this, this is why it wasn't working as expected in update 2 below: Passing a local variable to a partial that is rendered after the view has already loaded

如果有人知道如何解决这个问题，请告诉我.

If anyone knows how to solve that issue, let me know please.

更新 2:

我用引号更新了 javascript 并且它部分工作...从某种意义上说 javascript 现在可以正常工作，只要我单击链接，它就会在页面上显示一串文本部分只包含一串文本.但是，当部分包含表单字段代码时，就会出现问题.

I updated the javascript with the quotation marks and it partially works...in the sense that the javascript is now functional and it will cause a string of text to appear on the page when I click the link as long as I have the partial only contain a string of text. However, when the partial includes the form fields code, something goes wrong.

如果我只是将以下渲染代码直接粘贴到 new.html.erb 视图中的表单中，它会正确生成一个新的表单部分.

If I just paste the following render code directly into the form in the new.html.erb view, it produces a new form section properly.

 <%= render "add_round", f: f %>

但是，当我尝试在 comps_helper.rb 中包含类似的代码，然后从 link_to 中引用它时，它不起作用:

However, when I try to include similar code in comps_helper.rb and then reference it from the link_to, it does not work:

在 comps_helper.rb 中:

In comps_helper.rb:

def addRound(f)
   render "add_round", f: f 
end

在 new.html.erb 中:

In new.html.erb:

 <%= link_to "render it!", addRoundLink_path, remote: true %>
 <div id="some_id"></div>

我将 addRoundLink.js.erb 改为:

And I changed addRoundLink.js.erb to:

$("#some_id").html("<%=j addRound(f) %>");  #Is this the correct change to have made here?

在这种情况下，单击 link_to 链接没有任何作用.

Clicking the link_to link does nothing in that case.

有什么想法吗?

更新代码:

谢谢回复.我进行了以下更改，但似乎仍然无法正常工作.该链接出现在表单底部，但点击后不会改变任何内容.我错过了什么?

Thanks for the reply. I've made the following changes and it still does not appear to be working. The link appears at the bottom of the form but when clicked does not change anything. What am I missing?

routes.rb:

resources :comps
match '/new_competition', :to => "comps#new" 
get "/addRoundLink" => "comps#addRoundLink", :as => :addRoundLink   

注意:我包含了与comps"相关的其他 2 行，以防它们会导致问题.

Note: I included the other 2 lines related to "comps" just in case those would cause an issue.

comps_controller.rb:

comps_controller.rb:

def addRoundLink
  respond_to do |format|
    format.js
  end   
end

comps_helper.rb:

comps_helper.rb:

def addRound
  render "add_round"
end   

addRoundLink.js.erb:

addRoundLink.js.erb:

$("#some_id").html(<%=j addRound %>);

comps/new.html.erb:

comps/new.html.erb:

<%= link_to "render it!", addRoundLink_path, remote: true %>
<div id="some_id"></div>

谢谢.

原始问题

首先，我是 Rails 的新手.我已经阅读并尝试了许多类似问题的解决方案，但到目前为止没有任何效果.

First off, I'm new to rails. I've read and tried many solutions to similar questions but nothing has worked so far.

我用 rails form_for 和 fields_for 创建了一个表单.该表单创建了一个新的竞争(comp).比赛有很多轮.表单的上半部分(form_for 部分)接受有关比赛的详细信息作为输入，表单的下半部分接受有关每一轮的详细信息(fields_for 部分).该表格在这种基本格式中完美运行.

I created a form with rails form_for and fields_for. The form creates a new competition (comp). The competition has many rounds. The top half of the form (the form_for section) accepts the details about the competition as inputs and the bottom half of the form accepts details about each round (the fields_for section). The form works perfectly in this basic format.

我将 fields_for 部分中的所有代码都放入了部分代码中.我的计划是在表单底部创建一个添加新回合"链接，每次按下链接时，它只会显示链接上方的部分.这将为新一轮的表单添加一个新部分，并允许用户输入任意数量的轮次.这是我努力工作的部分.

I took all the code that is in the fields_for section and put it into a partial. My plan was to then create a "add new round" link to the bottom of the form that would simply display the partial above the link each time the link is pressed. This would add a new section to the form for a new round and allow the user to input as many rounds as they'd like. This is the part that I am struggling to make work.

我将此代码添加到我的 comps_helper:

I added this code to my comps_helper:

def addNewRound
   render "add_round"
end

这会呈现文件/views/comps/_add_round.html.erb.

This renders the file /views/comps/_add_round.html.erb.

我的问题是:当点击链接时，我如何让它在表单中呈现.据我所知，我所做的研究是:

My question is: how do I get this to render in the form when a link is clicked. As far as I can get with the research I have done is:

<%= link_to "Add new round", { }, :remote => true %>

我不完全知道将执行 addNewRound 方法的 {} 中应该包含什么内容.而且我不知道我需要将什么(如果有)添加到我的 comps_controller 文件中.

I don't exactly know what is supposed to go in the {} that will execute the addNewRound method. And I don't know what, if anything, I need to add to my comps_controller file.

非常感谢您的帮助.

推荐答案

你必须在你的控制器中创建一个动作

You have to create an action in your controller

app/controllers/some_controller.rb

def hello
  respond_to do |format|
    format.js
  end
end

并定义此操作的路由.

and define a route to this action.

routes.rb

get "/hello" => "some#hello", :as => :hello

然后像这样创建指向此操作的链接:

then create a link to this action like that:

<%= link_to "render it!", hello_path, remote: true %>
<div id="some_id"></div>

当你点击这个链接时，它会找到你的 action 并用 js(javascript) 响应，因为我们告诉 action 只用 js 响应.

When you click this link it will find its way to your action and respond with js(javascript) because we told action to respond with only js.

最后将部分渲染到视图中您想要的任何位置(*在此示例中为 some_id div*)

At the end render the partial to anywhere you want in your view(*in this example to the some_id div*)

app/views/some/hello.js.erb

$("#some_id").html("<%=j addNewRound %>");

警告:创建动态表单很痛苦.您将面临很多问题(例如为新表单元素设置不同的 id 等...).我强烈建议您使用 ryan bates nested_form gem

WARNING: Creating dynamic forms is a pain. You will face a lot of problems (like setting different ids for new form elements etc...). I highly recommend you to use ryan bates nested_form gem

这篇关于单击链接时通过呈现部分将部分添加到表单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！