Question

我试图创建一个包含两列的简单页面。在左栏中，用户可以填写表格。在表单提交上，我希望右列刷新（通过AJAX）并使用在控制器中创建的@url字符串填充div。现在，表单提交根本不会触发我的.js页面上的代码 - 而是重定向远离页面并将我的.js作为纯文本加载到浏览器中。这应该是这么简单 - 我做错了什么？

在config / routes中：

    root 'home#home'
    post '/pixify', to: 'home#pixify', as: "pixify",  format: 'js'

在HomeController中：

    class HomeController < ApplicationController
      respond_to :html, :js
      skip_before_action :verify_authenticity_token

      def home
      end

      def pixify
        @url = "http://example-url.com"
        respond_to do |format|
          format.js { render :layout => false }
        end
      end
    end

在views / home / home.html.haml中：

   %div#container
     %div.left-column
       = form_tag pixify_path, :remote => true do
         %fieldset
            %ul
                %li
                    %label{:for => "url-id"} URL ID:  
                    %input{:type => "text", :name => "url-id"}

            %input{:type => "submit", :value => "Generate url", :class => "button"}

     %div.right-column
       %div#generated-url

在views / home / pixify.js.erb中：

    console.log("This is working");   // but it isn't
    $('#generated-url').html('http://www.justanexample.com');

Answer 1

如果你没有在application.js文件中包含jquery_ujs lib，那么

js.erb文件将呈现为文本：

//= require jquery
//= require jquery_ujs

我敢打赌，＆＃39;默认＆＃39;之间的区别是什么？和应用程序＆＃39;文件。

你的gemfile中需要以下宝石：

gem 'jquery-rails'
gem 'jquery-ui-rails'

Answer 2

我明白了！ This answer让我走上了正确的道路。由于application.html.erb中的javascript标记，jquery_ujs无法正常工作。事实证明我需要改变这个：

<%= javascript_include_tag :defaults %>

到此：

<%= javascript_include_tag 'application' %>

我在解决单独的模板问题时更改了该行，但忘记将其切换回来。我还从控制器中删除了渲染语句（根据@VenkatCh的答案 - 谢谢！），现在一切都很顺利。

respond_to do |format| format.js end

在尝试使用AJAX时，Rails 4将JS加载为纯文本

2 个答案: