Rails UJS & Bootstrap导航栏

Question

• Rails 3.2.12
• JQuery v1.11.0

我正试图使引导导航条与Rails调用一起工作:remote =>真。

因此，对于Rails UJS，添加:remote => true to link_to将使link_to添加一个数据远程属性化元素。

在引导端，我添加了必要的数据切换属性。其结果是：

<ul class="nav nav-tabs">
  <li class="active">
    <a data-toggle="tab" data-remote="true" href="/public/page/features?menu=true">

        Features

    </a>
</li>
<li>
    <a data-toggle="tab" data-remote="true" href="/public/page/documentation?menu=true">

        Documentation

    </a>
</li>
<li>

因此，数据远程和数据切换设置得很好。现在，服务器端有一个响应ajax请求的rails控制器，还有一个包含以下内容的page.js.erb：

$('#replaceable').html("<%= escape_javascript( render("page") )%>");

这里的想法是，浏览器DOM的一部分，与“可替换的”相同，实际上被替换为名为“_page”的部分视图的呈现操作的结果。

然而，当我点击导航标签中的链接时，它不起作用。因此我在这里呼救:P

服务器日志显示如下：

Started GET "/public/page/features?menu=true" for 127.0.0.1 at 2014-06-02 16:47:52 +0200
Processing by PublicController#page as JS
Parameters: {"menu"=>"true", "id"=>"features"}
Page: features
Wiki: #<Wiki:0x007fe772aa0c88>
Web name 
  Reading page 'features' from web 'netxforge' 
  [1m[35mWeb Load (0.2ms)[0m  SELECT "webs".* FROM "webs" WHERE "webs"."address" = 
  'netxforge' LIMIT 1
  [1m[36mPage Load (0.1ms)[0m  [1mSELECT "pages".* FROM "pages" WHERE "pages"."web_id" = 2 
  AND (name   = 'features') LIMIT 1[0m
  Page 'features'  found
  [1m[35mRevision Load (0.1ms)[0m  SELECT "revisions".* FROM "revisions" 
  WHERE "revisions"."page_id"   =    32 ORDER BY id DESC LIMIT 1

[1m[36mPage Load (0.1ms)[0m  [1mSELECT "pages".\* FROM "pages" WHERE "pages"."id" = 32 LIMIT 1[0m       [1m[35mWeb Load (0.1ms)[0m  SELECT "webs".\* FROM "webs" WHERE "webs"."id" = 2 LIMIT 1       Rendered public/\_page.html.erb (8.3ms)       Rendered public/page.js.erb (9.4ms)       Completed 200 OK in 16ms (Views: 14.9ms | ActiveRecord: 0.6ms)

因此，我可以看到我的模板被呈现了，page.js.erb也呈现出来了，但是在浏览器中还是什么也没有发生。要替换的id确实存在！

对如何处理这件事有什么想法吗？

• 我在Gemfile中启用了JQuery UJS
• 我的application.js包括所有必要的东西。 //=需要jquery //=需要jquery_ujs

谢谢!克利斯朵夫

Answer 1

问题在于HTTP中返回的内容类型，而不是javascript，浏览器(本例中为JQuery)将其显示为文本，而不是对接收到的javascript进行整数。服务器应用程序更改内容类型的原因是一个过滤器，它会将内容类型设置为文本。(这是从应用程序继承来的，所以我不知道这件事)。

这里的教训是，在执行UJS时，请确保在firebug中检查响应头，并检查返回的内容类型。(对于第一个请求，对于以下请求，将接收一个未修改的304，该请求将不包含内容类型参数)。

注意:通过仔细阅读关于ajax调用的JQuery文档，我发现了jquery的内容类型处理，这就是jquery_ujs gem所使用的。