¿Cómo hacer llamadas Ajax con Rails 3 usando remote_function?

Question

Estoy tratando de realizar una llamada de cambio en un cuadro de selección. Para mi aplicación estoy usando jquery.js y rails.js como se mencionó para hacer uso de UJS. Pero aún el código que se genera es para Prototype y no para llamadas jquery ajax. Mi código es similar a la siguiente:

<%= select_tag :category, 
     options_for_select(
      Category.find(:all,:select=>"name,id").collect{|c| [c.name,c.id]}), 
     :onchange => remote_function(:url => {:controller => "posts", 
              :action => "filter_post", 
              :filter =>"category"}, 
            :with=>"'category_id=' + $('#category').val()") %> 

El código que se genera con esto es:

new Ajax.Request('/posts/filter_posts?filter=category', {asynchronous:true, evalScripts:true, 
parameters:'category_id=' + $('#category').val() + '&authenticity_token=' + 
encodeURIComponent('CCyYj1wqXtddK6pUV6bAxw0CqZ4lbBxDGQHp13Y/jMY=')}) 

Answer 1

Como Sergei dijeron: No hay remote_function en los carriles 3.

La solución es añadir discretamente el manejador onchange usando algo como:

$(function($) { 
    $("#selector_for_element").change(function() { 
     $.ajax({url: '<%= url_for :action => 'action_name', :id => @model.id %>', 
     data: 'selected=' + this.value, 
     dataType: 'script'}) 
    }); 
}); 

Esto llamará al método action_name en el controlador actual, pasando el resultado de selected=... como parámetro. Ahora puede devolver un fragmento de javascript, por ejemplo, usando algo como:

calculated = calculate_some_value_using(params[:selected]) 
render(:update) {|page| 
    page << "$('#selector_for_field_to_update).html(#{calculated})" 
} 

en el controlador. La cadena que agregas a '' página '' debe ser javascript válida y se ejecutará automáticamente si usas $ .ajax.

EDIT: Para su información, hemos añadido recientemente un cambio de selección de ayudante para jquery-EPU, por lo que se puede hacer de esta manera discreta utilizando el built-in jquery-ujs adaptador de ahora:

<%= select_tag :category_id, 
    options_for_select(
     Category.find(:all,:select=>"name,id").collect{|c| [c.name,c.id]}), 
    :data => { :remote => true, :url => url_for(:controller => "posts", 
             :action => "filter_post", 
             :filter =>"category") } %> 

aunque para ser justos, agregar un evento de cambio selectivo realmente nunca va a ser "discreto" ya que no existe una alternativa graciosa para los usuarios con javascript desactivado a menos que su formulario no dependa del resultado de la solicitud AJAX.

Answer 2

No hay remote_function en los carriles 3. Si está utilizando jQuery, puede hacer algo como esto:

$.ajax({ 
    type: 'POST', 
    url: 'http://your_url/blah', 
    data: 'param1=value1&params2=value2', 
    success: function(data){eval(data);} 
}); 

Answer 3

Después es el simple fragmento de jQuery desde mi punto de vista haml

:javascript 

    $("#select_box_id").change(function() { 
     $.post('#{target_url}?param_one='+$(this).val()); 
    }); 

Espero que esto ayude. Gracias ..

Answer 4

Ajax de llamadas a los controladores de acción con parámetros:

function combined_search() { 
    var countries = $('#countries').val(); 
    var albums = $('#albums').val(); 
    var artists = $('#artists').val(); 
    $.ajax({ 
     url:"<%=url_for :controller => 'music_on_demand',:action => 'combined_search' %>", 
     data:'country=' + encodeURIComponent(countries) + '&albums=' + encodeURIComponent(albums) + '&artists=' + encodeURIComponent(artists), 
     cache:false, 
     success:function (data) { 
     } 
    }) 
} 

Answer 5

Si se mira el problema que tuve de la actualización de un gran carriles de aplicación a los carriles 3, que hace un uso intensivo de remote_function, se puede lograr la compatibilidad hacia atrás limitada agregando un método application_helper que genera el código jQuery en el formato sugerido por otras respuestas aquí. Pude usar este código como está, aunque tuve que actualizar una parte del código de llamada para usar la nueva opción: script de éxito en lugar de la opción de actualizar hash que no es compatible aquí. Esto le puede comprar un poco de tiempo para refactorizar todo el tiempo remote_function llama a utilizar devoluciones de llamada de eventos discretos jquery-EPU:

def remote_function(options) 
    ("$.ajax({url: '#{ url_for(options[:url]) }', type: '#{ options[:method] || 'GET' }', " + 
    "data: #{ options[:with] ? options[:with] + '&' : '' } + " + 
    "'authenticity_token=' + encodeURIComponent('#{ form_authenticity_token }')" + 
    (options[:data_type] ? ", dataType: '" + options[:data_type] + "'" : "") + 
    (options[:success] ? ", success: function(response) {" + options[:success] + "}" : "") + 
    (options[:before] ? ", beforeSend: function(data) {" + options[:before] + "}" : "") + "});").html_safe 
end