jQuery的常規形式中的遠程形式 - 遠程形式是隱藏

Question

我有一個網頁編輯的對象（因爲它發生在一個組對象），其內部具有搜索表單，它應該刷新的可以添加到人名單羣組。我想設置它，以便內部窗體是一個遠程窗體，調用「/ groups/person_search」。這意味着遠程表單的提交按鈕不應該提交外部「組」表單。

這裏就是我目前所面對的 - 在我的rails模板（爲了清楚起見，切出部分路段）：

<%= form_for @group, :class => "disable_empty_fields" do |f| %> 
    <div class="main"> 

    <%= f.label :name, "Group name" %><br/> 
    <%= f.text_field :name, :size => "60" %><br/>  

    <%= f.label :description, "Group description" %><br/> 
    <%= f.text_area :description, :size => "60x8" %><br/> 

    <div class="section peoplesearch"> 
     <%= form_tag "/groups/person_search", :method => :get, :class => "xxx", :remote => true do %> 
     <div class="block"> 
      <div class="main"> 
      <label>Search</label> 
      <%= text_field_tag "search[term]", params[:search][:term], :class => "searchinput", :placeholder => "Search for someone" %> 
      <%= button_to_function "Go", "jQuery(this).parents('form').eq(0).submit();" %> 
      </div> 
     </div> 
     <% end %> 
    </div><!-- /.section --> 
    </div><!-- /.main -->   
    <div class="block submitblock"> 
    <div class="main"> 
     <button type="submit">Save</button>          
    </div> 
    </div> 
    <div class="block cancelblock"> 
    <div class="main"> 
     <%= link_to "<b>X</b> Cancel changes".html_safe, task_path(@group), :class => "button" %>   
    </div> 
    </div>     
<% end %>  

，並在生成的html：

<form accept-charset="UTF-8" action="/groups/1" class="edit_group" id="edit_group_1" method="post"> 
    <div style="margin:0;padding:0;display:inline"> 
    <input name="utf8" type="hidden" value="&#x2713;" /> 
    <input name="_method" type="hidden" value="put" /> 
    <input name="authenticity_token" type="hidden" value="vxGXV8vv2gvuk+7IIQwwsHcvFoVvET/h7eHcQUKuMco=" /> 
    </div> 
    <div class="main"> 
    <label for="group_name">Group name</label><br/> 
    <input id="group_name" name="group[name]" size="60" type="text" value="First group" /><br/>  
    <label for="group_description">Group description</label><br/> 
    <textarea cols="60" id="group_description" name="group[description]" rows="8">blah blah</textarea><br/> 

    <div class="section peoplesearch"> 
     <form accept-charset="UTF-8" action="groups/person_search" class="xxx" data-remote="true" method="get"> 
     <div style="margin:0;padding:0;display:inline"> 
      <input name="utf8" type="hidden" value="&#x2713;" /> 
     </div> 
     <div class="block"> 
      <div class="main"> 
       <label>Search</label> 
      <input class="searchinput" id="search_term" name="search[term]" placeholder="Search for someone" type="text" /> 
       <input onclick="jQuery(this).parents('form').eq(0).submit();" type="button" value="Go" /> 
      </div> 
     </div> 
     </form> 
    </div> 
    </div> <!-- /main --> 
    <div class="block submitblock"> 
    <div class="main"> 
     <button type="submit">Save</button>          
    </div> 
    </div> 
    <div class="block cancelblock"> 
    <div class="main"> 
     <a href="/tasks/1" class="button"><b>X</b> Cancel changes</a>   
    </div> 
    </div>  
</form> 

的 「XXX」表單上的類只是我可以在頁面源中快速找到它。

望着生成html，這一切看起來不錯，但是當我在「開始」按鈕，它應提交表單內單擊，它提交的外在形式。內形式不鍍鉻的DOM Inspector顯示出來，並在控制檯做jQuery("form").size()給我1，又彷彿內在形式是不存在的，即使我可以看到它的頁面的源代碼。

這可能是一些愚蠢的，有人可以設置我直？歡呼聲

Answer 1

HTML does not support nested forms. HTML5確實允許的輸入，以獨立於文檔結構的形式的連接。