2013-09-23 77 views
0

我在ruby 1.9 rails 3.2中有以下代碼。我跟蹤了幾個不同的網頁,嘗試更新網頁中的子字段。出於某種原因,它仍然重定向到一個新的頁面,但它沒有使用佈局渲染......這很奇怪。Ajax在rails中,仍然重定向到新頁面

路線:

match 'search' => 'content#search' 

查看:

<%= form_tag({:action => 'search'},:id => 'searchForm',:remote => true, :update => "ajaxstuffhere", :position => :bottom) do %> 
<p> 
        <label id="parkname">Park Name:</label><br/> 
        <%= text_field :search, :parkname, :size => 25 %> 
        </p> 
        <p> 
        <label id="stateprovince">State/Province:</label><br/> 
        <% tstate = State.new %> 
        <% tstate.name = "Select a State/Province" %> 
        <% @states = [] %> 
        <% @states << tstate %> 
        <% states = State.all.sort{|x,y| [x.country_id, x.name] <=> [y.country_id, y.name] } %> 
        <% states.each do |state| %> 
         <% @states << state %> 
        <% end %> 
        <%= puts "statelist is : " + @states.inspect.to_s %> 
        <%= collection_select(:search, :state, @states, :id, :name) %> 
        </p> 
        <p> 
        <label id="zipcode">Zip Code:</label><br/> 
        <%= text_field :search, :zipcode, :size => 5 %> 

        </p> 
        <p> 
        <label id="distanceSearchLabel">Max Distance:</label><br/> 

        <select id="distancePick" name="search[distance]"> 
         <option value="">Select Distance</option> 
         <option value="10">10km</option> 
         <option value="50">50km</option> 
         <option value="100">100km</option> 
         <option value="250">250km</option> 
         <option value="500">500km</option> 
         <option value="1000">1000km</option> 
        </select> 
        </p> 
        </p> 
        <p> 
        <%= submit_tag 'Search' %> 
        </p> 

       <div style="clear:both;"> 

       </div> 


      <h2>Narrow your Search</h2> 


      <a href="JavaScript:amenitiesPopup()">By Amenities</a> 
      <br /> 

      <p> 
       <label id="parkname">Price:</label><br/> 
       <%= text_field :search, :pricelow, :size => 5 %> 
       <%= text_field :search, :pricehigh, :size => 5 %> 
      </p> 
      <p> 
       <label id="parkname">Age:</label><br/> 
       <%= text_field :search, :age, :size => 5 %> 
      </p> 
      <p> 

      <%= check_box :search,:pets_allowed %><label id="petsallowedcb">Allows Pets</label><br/> 
      </p> 

      <%= check_box :search,:big_rigs %><label id="bigrigcb">Allows Big Rigs</label><br/> 

      <p> 
      <%= submit_tag 'Search' %> 
      </p> 
      <% end %> 

控制器:

def search 
    ... 
    render :partial => 'search' 
end #seach def 

我有ID爲 「ajaxstuffhere」 在HTML頁面中的空div。當我單擊表單上的提交按鈕時,它會將_search.html.erb加載到新頁面中而不是指定的div中。

感謝您的幫助!

編輯:下面是來自服務器的POST請求:

Started POST "/search" for 70.28.21.25 at 2013-09-25 13:22:54 +0000 
Processing by ContentController#search as HTML 
    Parameters: {"utf8"=>"â", "search"=>{"parkname"=>"as", "state"=>"", "zipcode"=>"", "distance"=>"", "pricelow"=>"", "pricehigh"=>"", "age"=>"", "pets_allowed"=>"0", "big_rigs"=>"0"}} 
Rendered content/_search.html.erb (424.3ms) 
Completed 200 OK in 637ms (Views: 105.6ms | ActiveRecord: 478.6ms) 

此外,格式的HTML渲染:

<form accept-charset="UTF-8" action="/search" data-remote="true" id="searchForm" method="post" position="bottom" update="ajaxstuffhere"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /></div> 

        <p> 
        <label id="parkname">Park Name:</label><br/> 
        <input id="search_parkname" name="search[parkname]" size="25" type="text" /> 
        </p> 
... 
<input name="commit" type="submit" value="Search" /> 
</form> 

編輯:1周後,仍然沒有功能

我有一個新的homepage.js.erb文件,內容如下:

("#ajaxstuffhere").hide(); 

在窗體上設置data-remote="true"時,應該返回並執行哪個據說。請注意,我切換到網頁控制器,直到我可以得到一個Ajax響應工作.....

嗯......沒有工作,所以我嘗試了咖啡腳本選擇:

<script> 
$(document).ready -> 
    $("#ajaxstuffhere").on("ajax:success", (e, data, status, xhr) -> 
    $("#ajaxstuffhere").append "<p>RESPONSE</p>" //xhr.responseText 
).bind "ajax:error", (e, xhr, status, error) -> 
    $("#ajaxstuffhere").append "<p>ERROR</p>" 
</script> 

我把這個權利放在html.erb文件的主體中。它應該在頁面加載時執行,我想呢?

無論如何,如果data-remote =「true」標記執行了ajax請求,那麼響應應該只是將「響應」添加到ajaxstuffhere字段中......除非事實並非如此。頁面仍然重新加載,AJAX響應可能丟失

+0

它提交通過'html'格式形式

與此相關的任何詳細信息,是值得歡迎的。你有'rails.js'安裝? – tihom

+0

根據我查看的網站,javascript來自包含頁面佈局中的javascript_include_tag:default。編輯:根據頁面的來源,只有assets/default.js已加載 – Chris

+0

它加載默認的js文件(如果存在),如果您的應用程序中沒有這些文件,則不會加載它們。 – tihom

回答

0

事實證明,我有一句臺詞:

<%= render :partial => '/inc/analytics' %> 

對於谷歌Analytics(分析),佈局內。在發佈請求期間,該行強制頁面導航到新頁面。

我不知道爲什麼會出現這種情況,或許google有一些actionlistener,它覆蓋了rails爲遠程表單提供的一種。

0

您的提交按鈕是否在正確的位置?使用表單的視圖的代碼片段會更容易。

+0

好的,我將編輯帖子 – Chris