未捕获的错误:没有这样的方法'显示'工具提示小部件实例

时间:2013-07-03 21:13:50

标签: jquery twitter-bootstrap twitter-bootstrap-rails twitter-bootstrap-tooltip

我正在使用ajax为我的注册提交表单,但是在尝试设置工具提示以显示从控制器返回的错误的错误消息时遇到问题。

JavaScript的:

$(document).on('ajax:success', '.user_modal_form', function(e, data, status, xhr) {
  var context;
  context = $(this);
  if (data.success) {
    $('button', context).hide();
    $('.spinner', context).show();
    location.reload();
  } else {
    if (data.errors != null) {
      $.each(data.errors, function(key, error) {
        var field;
        field = $("#athlete_" + key);
        field.attr('data-original-title', "" + key + " " + error).tooltip({
          trigger: 'manual'
        }).tooltip("show");
      });
    }
  }
});

错误讯息:Uncaught Error: no such method 'show' for tooltip widget instance

4 个答案:

答案 0 :(得分:137)

我遇到了同样的错误,这与jQuery UI存在冲突。

如果您使用jQuery UI,则需要重新排序脚本加载顺序。

我的工作负荷顺序:

  • 的jQuery
  • jQuery UI
  • 自举

答案 1 :(得分:4)

此问题的 root

  

"没有这样的方法'隐藏' for tooltip widget instance"

JqueryUI和Boostrap都有工具提示方法,

JqueryUI 的工作方式如下:

$el.tooltip("option","show");
$el.tooltip("option","hide");

Boostrap 的作用类似于:

$el.tooltip("show");
$el.tooltip("hide");

因此,由于 Bogdan Lewis 显示您需要重新排序脚本,例如 requirejs ,您需要在 Boostrap 之后加载的 jQueryUI的

var $ = require('jquery');
require('jquery_ui');
require('bootstrap');

并为requirejs调整 config ,例如:

    bootstrap: {
        deps: ['jquery', 'jquery_ui']
    },

答案 2 :(得分:1)

对我来说最简单的解决方案就是从jQuery UI发布版downloaded中删除工具提示组件。

答案 3 :(得分:1)

加载顺序:

1. jQuery
2. jQuery UI
3. $.fn.uitooltip = $.fn.tooltip;
4. Bootstrap
5. $.fn.bttooltip = $.fn.tooltip;

或:

1. jQuery
2. Bootstrap
3. $.fn.bttooltip = $.fn.tooltip;
4. jQuery UI
5. $.fn.uitooltip = $.fn.tooltip;

=>使用:

1. $el.uitooltip //jQuery
2. $el.bttooltip //Bootstrap