24 Aug
duccio

duccio il 24 August 2006 parla di Rails Snippet

Unobtrusive Javascript per Ruby On Rails

A che serve?

Unobtrusive Javascript plug in per Rails permette di inserire eventi javascript agli elementi delle pagine html scrivendoli direttamente in ruby nelle viste o nei controllori sfruttandoli come behaviour, così da non appensatire l’html renderizzato con lunghe sequenze di codice js.

Attualmente Unobtrusive lavora con i seguenti helper:

  • link_to_remote
  • link_to_function
  • button_to_function
  • form_remote_tag
  • submit_to_remote

se ve ne servissero di nuovi non ci sono problemi potete specificare nuovi comportamenti direttamente inline nelle viste e nei controllori. Comunque già con gli helper predefiniti ci sono dei notevoli vantaggi; ho provato ad usare il plugin su uno dei nostri progetti e questi sono due estratti del prima:

    1 <span id="main_detail_7"><a href="#" onclick="new Ajax.Request('/admin/category/tipology/show_details',{asynchronous:true, evalScripts:true, onComplete:function(request){Toggle.display('spin-7');Toggle.display('show_add_link_7')}, onLoading:function(request){Toggle.display('spin-7')}, parameters:'root_detail=7;'}); return false;"><img alt="vedi dettagli" src="/images/admin/open-down.gif?1156412983" title="vedi dettagli" /></a></span>

e dopo cura:

    1 <span id="main_detail_7"><a href="#" id="uj_element_6"><img alt="vedi dettagli" src="/images/admin/open-down.gif?1149667260" title="vedi dettagli" /></a></span>

Tutto quello che era in onclick=”…” viene inserito in un file esterno, generato a runtime, e applicato come comportamento all’elemento con id = “uj_element_6″

Se aveste bisogno di definire un comportamento particolare per un particolare elemento potete fare così:

    1 <%= apply_behaviour "#sayhellothenfade:click" do |page, element, event|
    2     page.alert "Ciao, scomparirò..."
    3     element.visual_effect :fade 
    4     end %>

Solitamente il behavior viene generato in un file .js a run time, è possibile inserirlo all’interno della pagina con :external => false come opzione.

Come si installa?

L’installazione è veramente semplice e veloce, innanzi tutto installate il plug in:

    1 script/plugin install http://source.ujs4rails.com/current/unobtrusive_javascript

chiaramente dalla root del vostro progetto (scusate se scrivo le banalità … ma secondo me repetita iuvant… sempre!!!), adesso lanciate:

    1 rake unobtrusive_javascript:install

copierà il file lowpro.js in /public/javascripts.

Aggiungere

    1 ... 
    2 <%= javascript_include_tag :defaults, :unobtrusive %>
    3 ...

nel vostro layout e mettere nel file routes.rb:

    1 ActionController::Routes.draw do |map|
    2   UnobtrusiveJavascript::routes
    3    # Le vostre route qui.
    4 end

1 Commento a “Unobtrusive Javascript per Ruby On Rails”

  1. zendigfrinere il 26 June 2008 alle 17:13 dice:

    this bonus ;)

Scrivi un commento