Ruby on Rails-Working with JavaScript in Rails

====

   Based on guides.rubyonrails.org

Working with JavaScript in Rails
    Unobtrusive JavaScript
        Jaav uses a "Unobtrusive javaScript" technique
        EX:

            < a href="#" data-background-color="#990000">Paint it red< /a>

            data-background is called in unobtrusive way because there is no mix between JavaScript and HTML
        Call:
            paintIt = (element, backgroundColor, textColor) ->
              element.style.backgroundColor = backgroundColor
              if textColor?
                element.style.color = textColor
           
            $ ->
              $("a[data-background-color]").click ->
                backgroundColor = $(this).data("background-color")
                textColor = $(this).data("text-color")
                paintIt(this, backgroundColor, textColor)
    Built-in Helpers
        Many view helper methods to assist generating HTML.

        form_for
            <%= form_for(@post, remote: true) do |f| %>
              ...
            <% end %>
        form_tag
            <%= form_tag('/posts', remote: true) %>
        link_to
            <%= link_to "a post", @post, remote: true %>

            <%= link_to "Delete post", @post, remote: true, method: :delete %>

            in CoffeScript, uses
                $ -> $("a[data-remote]").on "ajax:success", (e, data, status, xhr) -> alert "The post was deleted."
            or in directly
                <%= link_to "delete", account, method: :delete, data: { confirm: "You sure?" } %>
        button_to
            <%= button_to "A post", @post, remote: true %>
    The server side
        Usually, AJAX requests return JSON rather than HTML
            Controller
                class UsersController < ApplicationController
                  def index
                    @users = User.all
                    @user = User.new
                  end
                  def create
                      @user = User.new(params[:user])
                   
                      respond_to do |format|
                        if @user.save
                          format.html { redirect_to @user, notice: 'User was successfully created.' }
                          format.js   {}
                          format.json { render json: @user, status: :created, location: @user }
                        else
                          format.html { render action: "new" }
                          format.json { render json: @user.errors, status: :unprocessable_entity }
                        end
                      end
                    end
            index.html.erb
                < b >Users< /b >
   
                < ul id="users">  <----- appendto="" br="" fill="" here="" in="" js="" the="" will="">                    <% @users.each do |user| %>
                      <%= render user %>   <----- _user.html.erb="" br="" render="" the="">                    <% end %>
                < /ul >
               
                < br>
               
                <%= form_for(@user, remote: true) do |f| %>
                  <%= f.label :name %>

                  <%= f.text_field :name %>
                  <%= f.submit %>
                <% end %>
            _user.html.erb
                < li ><%= user.name %>< /li >
            create.js.erb
                It is called by the method create.
                $("<%= escape_javascript(render @user) %>").appendTo("#users");
    Turbolinks
        Uses AJAX to speed up page rendering in most applications
        It attaches a click handler to all < a > tags
        What to do
            Include turbolinks in Gemfile
            in app/assets/javascripts/application.js
                //= require turbolinks
            To disable turbolink
                < a href="..." data-no-turbolink>No turbolinks here< /a>.