¿Cómo puedo hacer que AJAX-y muestre/oculte condicional los campos de formulario en Rails?

Question

Me gustaría mostrar u ocultar algunos campos en un formulario en Rails, dependiendo del estado de un campo de selección en el formulario. No necesito (actualmente) una segunda búsqueda de base de datos para los campos, así que estoy tratando de mantener todo confinado a la vista. Tengo el esquema esbozado, pero estoy teniendo algunos problemas con los detalles de implementación.

Mi idea inicial era usar observe_field y llamar a Element.show etc. etc., pero luego tendría que escribir un condicional de Javascript. Esto probablemente tendrá que funcionar, pero quiero evitarlo si puedo.

Otro enfoque sería utilizar observe_field para solicitar una plantilla RJS, y replace_html para insertar los campos. No está mal, pero como estoy usando un bloque form_for, tendría que pasar la instancia del formulario a través de la plantilla RJS para hacerlo bien.

También podría actualizar el registro en cada pase, y mostrar el formulario bajo las nuevas condiciones, pero eso es lo que estoy tratando de evitar. Sería mucho más simple hacer esto todo en la vista.

¿Qué me falta aquí? ¿Cuál es la práctica aceptada para formularios condicional show/hide en Rails?

Answer 1

Como desarrollador de rieles, sugiero adherirse a los principios de JavaScript no intrusivo. En lo que respecta a los rieles, lo que esto generalmente significa es que no solo debe escribir una vista grande para manejar toda su funcionalidad. Esto hace que su vista HTML sea más fácil de desarrollar y mantener, hace que su comportamiento sea más fácil de mantener y, por lo general, lo ayuda a comprender mejor qué está haciendo exactamente su aplicación. Hasta ese punto, evito los rails javascript helpers a toda costa.

Lo que haría es dividir su comportamiento en un archivo javascript que codifique usted mismo. Usando una biblioteca como jquery (mi favorito para este tipo de cosas es lowpro, pero seré el primero en admitir que estoy un poco equivocado), es bastante fácil asociar un controlador de eventos a elementos específicos (o toda una clase de elementos a la vez).

Para un cuadro de selección, un controlador onChange se activará cuando el usuario cambie la selección. la propiedad selectedIndex del elemento le dirá qué opción se selecciona y la matriz options le permitirá buscar la opción asociada. Así, en su manejador que podría hacer algo como lo siguiente (utilizando prototipo):

function(e) { 
    var element = Event.element(e) 
    var index = element.selectedIndex 
    var option = element.options[index] 

    if(option.value == "Show fields") 
    $('hidden-fields').show() 
    else 
    $('hidden-fields').hide() 
} 

Answer 2

que manejan la misma cosa de diferentes maneras:

<%= link_to_function(check_box_tag "model[attribute_name]") do |page| 
    page.toggle :model_attribute_name 
end-%> 

<span style="display:none;" id="model_attribute_name"> 
<%= f.text_area :other_conditional_attribute -%> 
</span> 

o

<%= link_to_function "Conditional Item", :class => "your-style-class" do |page| 
    page.insert_html :bottom, :other_conditional_attribute, :partial => 'conditional_attribute_partial', :object => Object.new, :locals => {:local_variable => local_variable} 
end-%> 

El Los ayudantes de cosas/prototipos de rjs son increíbles.
Rails API: PrototypeHelpers
Rails API: JavascriptHelpers

Answer 3

se recomienda usar una simple función de jQuery lo largo de las líneas de:

$('a#slick-show').click(function() { 
    $('#slickbox').show('slow'); 
    return false; 
    }); 

Para los fundamentos de mostrar/ocultar en Jquery, hay un tutorial here.