Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Let's try something, it's a wild guess but I hope it will answer your need. You can try this in a new application. Just create a <strong>user</strong> model, and seed some data, and add the gem 'jquery-rails' in your assets group. Run <code>bundle install</code> and restart your server.</p> <p>In your <strong>assets/javascripts/application.js</strong>, ensure you have at least the following lines:</p> <pre><code>//= require jquery //= require jquery_ujs //= require_tree . </code></pre> <p>In your <strong>users_controller.rb</strong>, define the <strong>index</strong> method to fetch all users from the database and render <strong>index</strong> template, it's very simple you just have to do like this:</p> <pre><code>def index @users = User.all respond_to do |format| format.html format.js end end </code></pre> <p>Then edit your view file in <strong>views/users</strong> and be sure it's named <strong>index.html.erb</strong>. This view will be displayed when you try to access localhost:3000/users with your browser (in details: it's a GET HTML request). Inside your view you'll write HTML and embed ruby, just the same way as you usually do. For now simply create a div and your give it the id "more" and you also place a link with attribute <code>remote</code></p> <pre><code>&lt;%= link_to 'click me', users_path, remote: true %&gt; </code></pre> <p>Then create a new view file in <strong>views/users</strong> and name it <strong>index.js.erb</strong>. You notice that the extension changed, now we use <em>js.erb</em> instead of <em>html.erb</em>. In detail: when your page will do a javascript request (a GET JS in this case) to your <strong>users#index</strong> route, it will answer with the <strong>index.js.erb</strong> view. The big nice stuff here is you can write javascript code in this view that will get executed in your browser.</p> <p>You remember we added <code>remote: true</code> to the link? This tells rails to general a link that will make a JS request. Magic.</p> <p>So now you just have to write some javascript code in your <strong>views/users/index.js.erb</strong> file. Let's start with something super simple:</p> <pre><code>alert('Hello'); </code></pre> <p>Go to your page (normally localhost:3000/users) and click the 'click me' link, you should see the javascript alert box displaying.</p> <p>Let's do a second test, and integrate some ruby code. Change the content of your your <strong>views/users/index.js.erb</strong> by this :</p> <pre><code>alert('Ruby compute: &lt;%= 1+1 %&gt;'); </code></pre> <p>And in your web page, you'll see the alert with the test 'Ruby compute: 2'. You just have to adapt this technique to your case in your application et voila.</p> <p>The same technique (but with better explanation) can be found on this railscast: <a href="http://railscasts.com/episodes/136-jquery" rel="nofollow">http://railscasts.com/episodes/136-jquery</a></p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload