Rails UJS&引导导航栏

Rails UJS & Bootstrap navbar

本文关键字：导航 UJS amp Rails      更新时间：2023-09-26
  • 轨道3.2.12
  • JQuery v1.11.0

我试图让引导导航栏与Rails一起工作，调用：remote=>true。

因此，对于Rails UJS，在link_to中添加：remote=>true将使添加一个数据remote属性到元素。

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

<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>

所以数据远程和数据切换设置得很好。现在，在服务器端，我有一个rails控制器来响应ajax请求，还有一个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[36m页面加载(0.1ms([0m[1mSELECT"pages".*FROM"pages"WHERE"pages"."id"=32 LIMIT 1[0m[1m[35mWeb负载(0.1ms([0m选择"Web"。*从"Web"到"Web"的位置。"id"=2 LIMIT 1呈现的公共/''upage.html.erb(8.3ms(呈现的公共/page.js.erb(9.4ms(在16ms内完成200 OK(视图：14.9ms |活动记录：0.6ms(

因此，我可以看到我的模板被渲染，page.js.erb被渲染，但仍然什么都没有发生在浏览器中。要替换的id不存在！。

关于如何解决这个问题有什么想法吗？

  • 我在Gemfile中启用了JQuery UJS

  • 我的application.js包含了所有必要的功能。

    //=需要jquery//=需要jquery_ujs

谢谢！Christophe

问题是HTTP请求中返回的内容类型不是javascript，浏览器(本例中为JQuery(将其显示为文本，而不是对接收到的javascript进行积分。服务器应用程序更改内容类型的原因是过滤器将其设置为文本。(这是从应用程序中继承的，所以我对此一无所知(。

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

注意：我通过仔细阅读关于ajax调用的JQuery文档了解到了JQuery的内容类型处理，这就是JQuery_ujs gem所使用的。

相关文章：