2010-11-27 13 views
8

Ich möchte eine In-Place-Suche in meiner Rails-App machen.
Ich benutzte button_to_remote mit Prototyp, aber jetzt benutze ich JQuery, also änderte ich zu link_to.
Dies ist mein Code:link_to mit jquery params in rails

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

ich die Adresse Textfeld an meinen Controller übergeben werden soll, aber die Ausgabe ist nicht das, was ich erwartet habe.

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

Wie reiche ich meinen Wert ein?

Antwort

15

Sie möchten vielleicht versuchen, die Dinge ein wenig mehr unauffällig nähern. Ich würde empfehlen, Ihren link_to Anruf mit etwas zu ersetzen, wie:

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

Dies ist praktisch identisch zu dem, was Sie bereits haben, mit der Ausnahme, dass es eine eindeutige ID enthält, und auch die Steuerung/geocode Pfad in einem data-href Attribute. Dies wird Ihnen helfen, Ihren Rubin und Javascript ein bisschen mehr getrennt zu halten.

Dann in Ihrem application.js (oder irgendwo ähnlich):

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

Was dies effektiv macht, ist die Bindung eines click Ereignis-Listener auf Ihre Suchtaste, die Beiträge der Adresse auf die URL oder den Pfad in der data-href vorgesehen Attribut Ihres Suchlinks.

Ich stelle auch fest, dass Sie in Ihrem Code die id der Quelladresse in Ruby festlegen. Wenn dieses Attribut id basierend auf einer Art von Seitenvorlagenbedingungen geändert werden muss, können Sie das Beispiel erweitern, indem Sie einen weiteren data--Parameter zu Ihrem Link hinzufügen. Zum Beispiel:

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

Und wieder in application.js oben mit etwas entlang der Linien zu ersetzen:

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

Dies ist nicht gerade eine direkte Antwort auf Ihre Frage, aber haben Sie in jrails untersucht? Es ermöglicht Ihnen, die gleichen JavaScript-Helfer zu verwenden, die Sie vor dem Wechsel zu jquery verwendet haben. Es machte meinen Übergang von Prototyp zu Jquery viel einfacher.

2

Sie können dies versuchen:
<%= 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 
    }) 
}); 

 
3

Der einfachste Weg ist das Suchfeld zu setzen und die Taste in einer normalen Form einreichen (mit die Standardschienen sehen Helfer). Und Sie fügen die :remote => :true Option zu dem Formular hinzu. Siehe form_for url helper für die Dokumentation.

Ich gueuss Sie bereits die jquery spezifische rails.js Datei hinzugefügt.

Wenn Sie so vorgehen, wird das Formular automatisch über AJAX an die angegebene Aktion gesendet.

Danach brauchen Sie nur einen 'ajax: success' Event-Handler, damit Sie mit den Daten umgehen können.

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