Rails 5 - 使用 collection_radio_buttons 打开带有嵌套模型的部分? [英] Rails 5 - use collection_radio_buttons to open a partial with nested models?

问题描述

(我的第一个问题，所以请善待！)

每个时间表只有一个系统；每个系统都有许多应用程序；每个应用程序都有许多用户和文档.

我想做什么来创建日程表条目:

生成一个表单，首先显示多个可单击的系统名称.单击系统时，它会打开一个部分，列出与该系统关联的应用程序.然后，当单击特定应用程序时，会打开另一个部分，其中包含与该特定应用程序关联的用户和文档.

稍后编辑此条目时，我希望能够看到我之前输入的所有内容，并且已经预先选择了正确的系统、应用程序、用户和文档.

我的问题是如何制作一个表单元素来选择一个系统，该系统将打开另一个部分 - 稍后在我查看和/或编辑条目时将被预选.

现在有用的是 <%= link_to %>，使用 Bootstrap 样式，单击时会打开其关联的应用程序部分.但是，我无法从中保存系统，并且我无法确定它是否可以在以后显示为已选择，例如在编辑表单中.

我们正在尝试使用单选按钮代替(因为您无法预先选择一个 link_to，对吧?)，所以我一直在用 f.collection_radio_buttons 将意大利面扔到墙上，或迭代 f.radio_button，或 标签.但是，我不知道如何让单选按钮打开部分.

自从第一次发布这个问题以来，我已经将范围缩小到在循环中使用 f.radio_button.在稍后编辑条目时查看时它显示为正确已检查"，但它仍然没有打开部分.

这里是 /_schedule_form.html.erb 的一个片段:

<%= form_for @schedule do |f|％＞<% System.all.each 做 |a|％＞<!-- 这个link_to 使Applications 部分出现，但仅此而已--><%= link_to a.system_nm, system_applications_path(:system_id => a.id,:schedule_id =>params['id']), :title =>'点击选择系统',:类->'btn btn-default btn-flat active'，数据:{:remote =>真的，'数据目标' =>'#applicationList'} %></a><!-- 关闭 link_to 标签，我相信--><%结束%><div id="applicationList"><!-- 应用程序部分呈现在这里-->

<%结束%>

这是打开 _system_applications.html.erb 部分的 system_applications.js.erb 文件:

$("#applicationList").html("<%= escape_javascript(render'system_applications'，本地人:{应用程序:@applications，schedule_applications_array: @schedule_applications_array})%>");

这里有一个可能的线索的更新:我现在正在使用这个嵌入式 Ruby 代码:

<% System.all.each do |rt|％＞<标签><%= f.radio_button :system_id, rt.id, data:{:remote =>真，'数据目标' =>'@applicationList'}, href: system_applications_path(:system_id => rt.id,:schedule_id =>params['id']), class: 'remote-input', onclick:#applicationsList"%><%结束%>

而且，当我点击那个单选按钮时，我在浏览器控制台中收到一个 JS 错误 Uncaught SyntaxError: Invalid or Unexpected Token 它指向呈现的 HTML，特别是 > 在行尾:

<input data-remote="true" data-data-target="#applicationList" href="/schedules/system_applications/24?schedule_id=122" class="remote-input" onclick="#applicationList" type="radio" value="24" checked="checked" name="schedule[system_id]" id="schedule_system_id_24"/>

只是为了让它更复杂:创建新条目时，当我将鼠标悬停在 link_to 按钮之一上时，我会得到一个干净的路径，例如 /schedules/system_applications/24，这就是单击时发送到服务器(然后将参数读取为 {"system_id"=>"24"}.但是将鼠标悬停在 f.radio_button 标签上不显示路径，然后点击它发送 "/schedules/new?schedule%5Bsystem_id%5D=24" 和参数 {"schedule"=>{"system_id"=>"24"}}.这会触发 500(内部服务器错误)(这是有道理的，因为该 URL 没有路径).参数是否需要相同?如果是这样，我怎么搞砸了?

此外，单击单选按钮将请求发送到 SchedulesController#new，同时单击 link_to 将请求发送到 SchedulesController#system_applications.我不明白我是如何告诉单选按钮将其发送到 #new.

我现在卡住的地方是，f.radio_button 呈现为已检查"，这是正确的；但它不会打开部分.link_to 版本打开部分，但我不认为它可以在以后呈现为已检查".

如果我也问得够清楚，请告诉我.

解决方案

我认为我们做到了.一项关键更改是使用 url 而不是 href 来使用 system_applications_path 到控制器，如下所示:

<% @systems.each do |a|<label class="btn btn-sm btn-default"><%= f.radio_button :system_id, a.id, :data =>{url:system_applications_path(:system_id=>a.id, :schedule_id =>params['id']), 'data-target' =>'#applicationList'+a.id.to_s，:远程 =>真}%><%=a.system_nm%><%结束%>

现在，当我单击单选按钮时，它会打开正确的部分，并在我稍后编辑条目时显示为已选择.Bootstrap 样式 (btn btn-sm btn-default) 有助于显示有多少可点击区域，但它不是基本功能所必需的.

我想一些 [in] 著名的 Rails Magic 有 radio_buttons 处理 href: 与 url 不同的地方.但它的魔法"只是因为我不理解它(但 - 成长心态！).背后的解释是什么?

(my first SO question, so please be kind!)

Each Schedule has only one System; Each System has many Applications; Each Application has many Users and Documents.

What I want to do to create a Schedule entry:

Generate a form that first shows multiple System names that can be clicked. When a System is clicked, it opens a partial that lists Applications associated with that System. Then, when clicking particular Applications, yet another partial opens that contains Users and Documents associated with that particular Application.

When editing this entry later, I want to be able to see everything I had entered before, with the correct System, Application(s), User(s), and Document(s) already pre-selected.

My question here is how to make a form element for choosing a System that will open another partial -- and, later, will be pre-selected when I view and/or edit the entry.

What kinda works right now is a <%= link_to %>, styled with Bootstrap, which opens its associated Applications partial when it's clicked. However, I'm not able to save the System from it, and I can't figure out whether it can display as already-selected later, such as in an Edit form.

We're trying to use radio buttons instead (because you can't pre-select a link_to, right?), so I've been throwing pasta at the wall with f.collection_radio_buttons, or iterating over f.radio_button, or a tag of <input type="radio">. However, I can't figure out how to make a radio button open a partial.

Since first posting this question, I've narrowed down to using f.radio_button within a loop. It shows as correctly "checked" when viewed while Editing the entry later, but it still doesn't open the partial.

Here's a snippet from /_schedule_form.html.erb:

<%= form_for @schedule do |f| %>

  <% System.all.each do |a| %>

   <!-- This link_to makes the Applications partial appear, but that's all it does -->
    <%= link_to a.system_nm, system_applications_path(:system_id => a.id, 
    :schedule_id => params['id']), :title => 'Click to choose system', 
    :class -> 'btn btn-default btn-flat active', data: {:remote => true, 
    'data-target' => '#applicationList'} %>
     </a>  <!-- closes the link_to tag, I believe -->
    <% end %>

      <div id="applicationList">
         <!-- the Applications partial renders here -->
      </div>

   <% end %>

Here's the system_applications.js.erb file that opens the _system_applications.html.erb partial:

$("#applicationList").html("<%= escape_javascript(render 
    'system_applications', locals: {applications: @applications, 
    schedule_applications_array: @schedule_applications_array})%>");

Here's an update with possible clue: I'm now using this embedded Ruby code:

<% System.all.each do |rt| %>
  <label>
    <%= f.radio_button :system_id, rt.id, data:{:remote => true, 'data-target' => 
   '@applicationList'}, href: system_applications_path(:system_id => rt.id, 
   :schedule_id => params['id']), class: 'remote-input', onclick: 
   "#applicationsList" %>
  </label>
<% end %>

And, when I click on that radio button, I'm getting a JS error in the browser console Uncaught SyntaxError: Invalid or Unexpected Token which points to the rendered HTML, and specifically the > at the end of the line:

<input data-remote="true" data-data-target="#applicationList" href="/schedules/system_applications/24?schedule_id=122" class="remote-input" onclick="#applicationList" type="radio" value="24" checked="checked" name="schedule[system_id]" id="schedule_system_id_24" />

Just to make it more complicated: When creating a NEW entry, and when I hover over one of the link_to buttons, I get a clean-looking path like /schedules/system_applications/24, and that's what gets sent to the server when clicked (which then reads the params as {"system_id"=>"24"}. But hovering over the f.radio_button labels shows no path, and clicking it sends "/schedules/new?schedule%5Bsystem_id%5D=24" with the params {"schedule"=>{"system_id"=>"24"}}. This triggers a 500 (Internal Server Error) (which makes sense, because there's no path for that URL). Do the params need to be the same? If so, how am I screwing it up?

Also, clicking the radio button sends the request to SchedulesController#new, while clicking the link_to sends it to SchedulesController#system_applications. I don't understand how I'm telling the radio button to send it to #new.

Where I'm stuck now is, the f.radio_button renders as "checked", which is correct; but it doesn't open the partial. The link_to version opens the partial, but I don't think it can render as "checked" later on.

Let me know if I'm asking clearly enough, too.

解决方案

I think we made it work. One key change was to use url instead of href to use the system_applications_path to the controller, as shown here:

<% @systems.each do |a|
  <label class="btn btn-sm btn-default">
    <%= f.radio_button :system_id, a.id, :data => {url:system_applications_path(:system_id 
    => a.id, :schedule_id => params['id']), 'data-target' => '#applicationList'+a.id.to_s,
    :remote => true} %>
    <%= a.system_nm %>
  </label>
<% end %>

Now, when I click the radio button, it opens the correct partial, and it shows as selected later when I go to edit the entry. The Bootstrap styling (btn btn-sm btn-default) helps to show how much clickable area there is, but it's not required for basic functionality.

I suppose some of that [in]famous Rails Magic has radio_buttons treating href: differently than url. But it's "magic" only because I don't understand it (yet -- growth mindset!). What's the explanation behind it?

这篇关于Rails 5 - 使用 collection_radio_buttons 打开带有嵌套模型的部分?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！