2009-06-20 6 views
1

J'ai une page qui doit tirer le contenu d'une base de données et potentiellement d'autres sources.Comment utiliser JQuery pour charger du contenu à partir d'une base de données via une méthode d'action ruby ​​on rails?

Voici comment j'ai structuré mon application rubis sur rails.

/Index - ceci a trois sections différentes qui doivent charger dans trois différents types de contenu. Chacun prendra un temps différent pour revenir, en tant que tel, je veux afficher un message de chargement pendant que je joue pour chaque div à remplir avec des données.

Pour charger les données, idéalement, je veux appeler une méthode Ruby sur mon contrôleur, puis rendre un partiel.

J'ai effectué une recherche, mais je ne vois pas comment vous pouvez charger l'index de la page, puis charger les données à partir des méthodes d'action en tant qu'action distincte.

Répondre

4

Si vous utilisez une version plus récente de Rails, et je voulais le faire de façon plus discrète possible, vous devez utiliser les: options de respond_to dans votre contrôleur, comme ceci:

class MyController < ApplicationController 

    def first_method 
    respond_to do |format| 
     format.html # this handles normal requests asking for html 
     format.js # this handles requests asking for javascript to be sent instead 
     end 
    end 

end 

Si vous répondez à un clic, vous feriez quelque chose comme la cuisson de la requête comme si la page

$("a.element_you_click_to_trigger").click(function(e) { 
    e.preventDefault(); // make sure clicking doesn't trigger unneeded event bubbling 
    $.ajax({url: "/controller/first_method", type: "POST", dataType: "script"}); // send a request and tell the server that you want javascript back 
} 

Tout comme vous avez un fichier index.html.erb dans votre dossier pour que des vues contrôleur, vous auriez un similaire fichier first_method.js.erb dans le dossier de vues correspondant le long du côté votre fichier index.html.erb:

views 
    controller 
    index.html.erb 
    first_method.js.erb 

Ceci renvoie le javascript qui est exécuté côté client, mais il obtient la construction côté serveur, de sorte que vous pouvez contenir des rails fragments ERB, de sorte que vous pouvez faire quelque chose comme ceci:

$('#loading_placeholder_element').html('<%= escape_javascript(render(:partial => "create")) %>'); 

// do some other stuff you fancy in the page 

// then make the next call once the other stuff is over (you may need to add this as a call back on an animation): 
$.ajax({url: "/controller/second_method", type: "POST", dataType: "script"}); 

Vous feriez alors répéter le même processus pour chacun des autres méthodes plus que FSMF mises en évidence.

J'ai trouvé ce Railscast on jQuery incroyablement utile quand j'apprenais cela il y a quelques mois, et je le recommande vraiment.

Espérons que cela aide!

+0

Merci, c'est l'approche que j'ai suivie lorsque j'ai développé le site. Merci de valider mon idée :) –

0

Vous devez utiliser ajax pour cela.

http://docs.jquery.com/Ajax

Je ne sais pas comment utiliser rubis ou rubis sur des rails. Mais je suppose que le concept est le même.

Un exemple:

$.post("yourAjaxTarget.html",{ //html as an example 
    attribute1: "blabla", 
    attribute2: 1234 
     }, function(data){ 
     //do something 
     }, "json"); 
0

En supposant que vous avez installé jRails plugins.

class MyController < ApplicationController 

    def index 
    # your main action 
    end 

    def long_section 
    # this method should accept XHR requests 
    # and render the HTML view 
    # long_section.html.erb 
    render :layout => false # or partial 
    end 

    def very_long_section 
    # this method should accept XHR requests 
    # and render the HTML view 
    # very_long_section.html.erb 
    render :layout => false # or partial 
    end 

end 

Dans votre vue index.html.erb.

<h1>Index</h1> 

<div id="index">First section here.</div> 
<div id="second">Second section here.</div> 
<div id="third">Third section here.</div> 

<%= remote_function(:action => "long_section", :update => "second") %> 
<%= remote_function(:action => "very_long_section", :update => "third") %> 
Questions connexes