1

これはちょっと驚きです。私の送信タグはフォーム内で発生するはずのように見えますが、フォームの前に表示されます。HTML ソースは問題ないように見えますが、結果の表示と DOM は間違っています。何がそれをシャッフルしたのかわかりません。送信ボタンはフォームの前に表示されます。

何か見えますか？

ファイルを閲覧する：

<%= content_tag :table do %>
  <%= content_tag :thead do %>
    <% 5.times do |q| %>
      <%= content_tag :th, "1" %>
    <% end %>
  <% end %>
  <%= content_tag :tbody do %>
    <%= form_tag program_participant_round_survey_path(
        program_id: @program.id, participant_id: @participant.id, round_id: @current_round.id), :method => 'put'  do %>
      <%= render partial: 'value', collection: @values  %>
      <%= submit_tag "Save" %>
    <% end %>
  <% end %>
<% end %>

html の重要な部分:

...
<tr>
  <td>
    Scaling Up vs. Scaling Out
</td>
    <td>
      <input id="values__q0" name="values[]" type="radio" value="q0" />
</td>    <td>
      <input id="values__q1" name="values[]" type="radio" value="q1" />
</td>    <td>
      <input id="values__q2" name="values[]" type="radio" value="q2" />
</td>    <td>
      <input id="values__q3" name="values[]" type="radio" value="q3" />
</td></tr>
      <input name="commit" type="submit" value="Save" />
</form></tbody></table>
  </div>
</div>
</body>
</html>

ブラウザでページがどのように表示されるかを次に示します。ブラウザの画像

そして、これはDOMとしてどのように見えるかです:ここに画像の説明を入力

4

2 に答える 2

3

これが、ブラウザがテーブル内の要素で、テーブルに属さないものを処理する方法です。ブラウザは、それらがキャプションであると想定し、テーブルの前に移動します。

生成されたコードでは<input type="submit">、テーブル内に a がありますが、 a内にはありません。<tr>

をラップする<input>と<tr><td>、テーブルの前に移動しなくなります。レイアウトにテーブルを使用することはお勧めできません。

于 2012-11-08T20:00:28.360 に答える
1

何が起こっているのか正確な理由はわかりませんが、個人的には次のようにします。

<%= form_tag program_participant_round_survey_path(
        program_id: @program.id, participant_id: @participant.id, round_id: @current_round.id), :method => 'put'  do %>
  <%= content_tag :table do %>
    <%= content_tag :thead do %>
      <% 5.times do |q| %>
        <%= content_tag :th, "1" %>
      <% end %>
    <% end %>
    <%= content_tag :tbody do %>        
      <%= render partial: 'value', collection: @values  %> 
    <% end %>
  <% end %>
  <%= submit_tag "Save" %>
<% end %>
于 2012-11-08T19:57:03.273 に答える