如何在rails 4.2.4中用ruby 2.2.3实现Javascript/ Jquery

Question

我正在构建一个与红宝石rails应用程序。rails和ruby的版本如上面所列。

我的目标是将JavaScript/ Jquery实现到我的mindmap索引视图中，这样他们就可以动态地将信息添加到我的页面中，而不必重新加载整个页面。因此，它们将是要单击的链接，该链接将显示正念图表单，在提交表单时，表单应消失，新数据应附加到指定的div视图中。--到目前为止，我已经能够在点击新链接时显示出正念图表单，但是表单在提交表单时并没有消失。我已经允许用户输入和提交信息，但信息只显示后，我做了一个完整的页面重新加载。

我试过一个数字，但似乎没有任何帮助。

谁来帮帮忙。如果你住在芝加哥，我欠你一瓶啤酒。)

下面是控制器、js和视图文件。

class MindmapsController < ApplicationController

  before_action :find_capsule, only: [:new, :index, :create, :show, :update, :destroy]
  before_action :find_mindmap, only: [:show, :edit, :index, :update, :destroy]

  before_action :authenticate_author!

  def index
    @mindmaps = Mindmap.all.order('created_at DESC')

  end

  def new
    @mindmap = Mindmap.new
  end

  def create
    @mindmap = Mindmap.new(mindmap_params)
    if @mindmap.save
      respond_to do |format|
        format.html {redirect_to mindmaps_path , notice:"You have successfully created a Mindmap"}
        format.js
      end
    else
      render 'new'
    end
  end

  def show
  end

  def edit
  end

  def update
    if @mindmap.update(mindmap_params)
      redirect_to @mindmap , notice:" You have successfully updated Your Mindmap"
    else
      render 'edit'
    end
  end

  def destroy
    @mindmap.destroy
    redirect_to mindmaps_path
  end

  def find_mindmap
    @mindmap = Mindmap.find_by(params[:id])
  end

  def find_capsule
    @capsule = current_author.capsules.find_by(params[:id])
  end

  def mindmap_params
    params.require(:mindmap).permit(:src, :src_purpose, :capsule_id, :profile_id)
  end
end

JavaScript文件是位于头脑地图视图文件夹下的FYI。

new.js.erb

$("a#new_mindmap_link").hide().after("<%= j render('form')%>");

create.js.erb

$("form#new_mindmap").remove();
$("a#new_mindmap_link").show();
$("div#mindmap").append("<%= j render(@mindmaps) %>");

正念图索引页

Mindmaps#index

<%= link_to "Create Mindmap", new_mindmap_path, id:"new_mindmap_link", remote: true %>
<% @mindmaps.each do |mindmap| %>
<div class="mindmap">    
    <div>Source: <%= mindmap.src %></div>
    <div class="meta">
  <%= link_to time_ago_in_words(mindmap.created_at) + " ago" , mindmap %>
        <span class="admin"><%= link_to "Edit", edit_mindmap_path(mindmap) %>
          <%= link_to "Delete", mindmap ,  method: :delete, data: { confirm: "Are you sure you want to delete this Mindmap" } %>
        </span>
    </div>
  </div>
<% end %>

正念图形式

<div class="col-md-4 mindmap-container">
  <%= simple_form_for @mindmap, remote: true do |f| %>
    <%= f.input :src, as: :url, class:'form-control', label: false, placeholder:"Add a URL" %>
    <%= f.input :src_purpose, as: :text, class: 'form-control', label: false,  placeholder: "Add a description to your URL"%>
    <%= f.input :capsule_id, label: false, collection: Capsule.all, default: 'Select a capsule', label_method: :title %>
    <%= f.input :profile_id, label: false, collection: Profile.all, default: 'Select a Profile ID',label_method: :profile_name %>
    <%= f.button :submit, class:'btn btn-primary' %>
    <% end %>
</div>

Answer 1

如果您检查您的日志，我怀疑是否调用了js.erb视图，因为您的操作目前只知道响应html。我认为解决这个问题的一种方法是在创建操作中添加一个respond_to块

def create
    @muse = Muse.new(muse_params)
    @muse.author_id = current_author.id
    if @muse.save
      respond_to do |format|
         format.html { redirect_to @muse, notice: "You have successfully added your muses" }
         format.json
      end
    else
      render :new
    end
  end

如果这有帮助，请告诉我。