簡體   English   中英

link_to與rails中的jquery params

[英]link_to with jquery params in rails

我想在我的rails應用程序中進行就地搜索。
我使用了button_to_remote和原型,但現在我正在使用JQuery,所以我改為link_to。
這是我的代碼:

<%= link_to "Search", {:action => "geocode", :with => "'address='+$('#{address_helper_id}').value"}, :method => :post, :remote => true %>

我想將地址文本字段傳遞給我的控制器,但輸出不是我所期望的。

/mycontroller/geocode?with=%27address%3D%27%2B%24%28%27record_location___address%27%29.value

我如何提交我的價值?

您可能想嘗試更不引人注意地接近事物。 我建議用以下內容替換你的link_to調用:

<%= link_to "Search", "#", :id => "search_geocode", :"data-href" => my_controller_geocode_path %>

這實際上與您已有的相同,只是它包含唯一的id,以及data-href屬性中的控制器/地理編碼路徑。 這將有助於您保持ruby和javascript更加分離。

然后在你的application.js (或類似的地方):

$('#search_geocode').live('click', function(event){
    event.preventDefault();
    $.post($(this).attr('data-href') + "?address=" + $('#address').val(), function(data){} );
});

這實際上是將click事件監聽器綁定到您的搜索按鈕,該按鈕將地址發布到搜索鏈接的data-href屬性中提供的URL或路徑。

我還注意到在你的代碼中,你在ruby中設置了源地址的id 如果此id屬性需要根據某種頁面模板條件進行更改,則可以通過向鏈接添加其他data-參數來擴展我的示例。 例如:

<%= link_to "Search", "#", :id => "search_geocode", :"data-href" => my_controller_geocode_path, :"data-address-id" => address_helper_id %>

再次,在application.js替換上面的內容:

$('#search_geocode').live('click', function(event){
    event.preventDefault();
    $.post($(this).attr('data-href') + "?address=" + $($(this).attr('data-address-id')).val(), function(data){} );
});

最簡單的方法是將搜索字段和提交按鈕放在普通表單中(使用默認的rails視圖助手)。 並在表單中添加:remote => :true選項。 請參閱form_for url helper以獲取文檔。

我猜你已經添加了jquery特定的rails.js文件。

這樣做會自動通過ajax將表單發布到給定的操作。

之后,您只需要一個'ajax:success'事件處理程序,以便您可以處理數據。

$('<id of the form').bind('ajax:success', function(event, data, status, xhr) {
   ... process your data here ...
} 

你可以試試這個:
<%= text_field_tag :address %>
<%= submit_tag "Search", :id => "search_button" %>


### Paste following code in your javascript

$("#search_button").live("click", function(){
  $.ajax({
    complete:function(request){},
    data:'address='+ $('#address').val(),
    dataType:'script',
    type:'get',
    url: '[ROUTE TO ACTION]' // in your case, may be '/[CONTROLLER NAME]/geocode' until you define route
  })
});

這不是你問題的直接答案,但你有沒有看過jrails 它允許您在切換到jquery之前使用您使用的相同原型javascript助手。 它使我從原型到jquery的過渡變得更加容易。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM