Come posso eseguire i campi di visualizzazione/occultamento condizionale AJAX-y in Rails?

Question

Mi piacerebbe mostrare o nascondere alcuni campi in un modulo in Rails, a seconda dello stato di un campo di selezione nel modulo. Non ho (al momento) bisogno di una seconda ricerca del database per i campi, quindi sto cercando di mantenere tutto limitato alla vista. Ho delineato il contorno, ma ho qualche problema con i dettagli di implementazione.

Il mio primo pensiero era usare observe_field e chiamare Element.show ecc. Ecc., Ma poi avrei dovuto scrivere un condizionale Javascript. Questo probabilmente dovrà funzionare, ma voglio evitarlo se posso.

Un altro approccio sarebbe utilizzare observe_field per richiedere un modello RJS e replace_html per inserire i campi. Non male, ma dal momento che sto usando un blocco form_for dovrei passare l'istanza del modulo completamente attraverso il modello RJS per farlo bene.

Potrei anche aggiornare il record su ogni passaggio e visualizzare il modulo nelle nuove condizioni, ma è quello che sto cercando di evitare. Sarebbe molto più semplice fare tutto questo nella vista.

Cosa mi manca qui? Qual è la pratica accettata per mostrare/nascondere i moduli condizionali in Rails?

Answer 1

Come sviluppatore di rotaie, suggerisco di aderire ai principi del javascript non invadente. Quando si tratta di binari, ciò che in genere significa è che non si dovrebbe scrivere solo una vista grande per gestire tutte le funzionalità. Ciò facilita lo sviluppo e la manutenzione della visualizzazione HTML, semplifica il mantenimento del comportamento e porta di solito a una migliore comprensione di ciò che sta facendo l'applicazione. In tal senso, evito rails javascript helper a tutti i costi.

Quello che vorrei fare è dividere il tuo comportamento in un file javascript che tu stesso codice. Usando una libreria come jquery (il mio preferito per questo genere di cose è lowpro, ma sarò il primo ad ammettere di essere un po 'impostato nei miei modi), è piuttosto facile associare un gestore di eventi a elementi specifici (o un'intera classe di elementi contemporaneamente).

Per una casella di selezione, un gestore onChange viene generato quando l'utente modifica la selezione. la proprietà selectedIndex sull'elemento indica quale opzione è selezionata e la matrice options consente di cercare l'opzione associata. Quindi, nel gestore si potrebbe fare qualcosa di simile a quanto segue (utilizzando 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

mi occupo la stessa cosa alcuni modi diversi:

<%= 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-%> 

Il roba di RG/aiutanti di prototipi sono fantastici.
Rails API: PrototypeHelpers
Rails API: JavascriptHelpers

Answer 3

Io suggerirei di usare una semplice funzione di JQuery lungo le linee di:

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

Per le basi di mostra/nascondi in jQuery, c'è un tutorial here.