【问题标题】:Override Minimum length string of Select2覆盖 Select2 的最小长度字符串
【发布时间】:2013-11-28 16:23:24
【问题描述】:

Select2 Jquery 插件

我很难在 jquery Select2 中覆盖最小长度输入的默认消息。

默认情况下,插件会给出以下消息。

默认文本

Please enter 1 more characters

我的要求是显示以下文字

必填文本

Enter 1 Character

请分享解决方案。 谢谢。

【问题讨论】:

  • 如果您只想完全隐藏它,也可以使用 css:` .select2-results__option.select2-results__message { display: none; } `
  • 我想覆盖文本而不是隐藏它。

标签: jquery-select2


【解决方案1】:

已接受的答案不适用于 Select2 v4。扩展 @IsaacKleinman 的评论,覆盖单个 Select2 实例的默认消息的方法是通过 language 属性:

var opts = {
  language: {
    inputTooShort: function(args) {
      // args.minimum is the minimum required length
      // args.input is the user-typed text
      return "Type more stuff";
    },
    inputTooLong: function(args) {
      // args.maximum is the maximum allowed length
      // args.input is the user-typed text
      return "You typed too much";
    },
    errorLoading: function() {
      return "Error loading results";
    },
    loadingMore: function() {
      return "Loading more results";
    },
    noResults: function() {
      return "No results found";
    },
    searching: function() {
      return "Searching...";
    },
    maximumSelected: function(args) {
      // args.maximum is the maximum number of items the user may select
      return "Error loading results";
    }
  }
};
$('#mySelect').select2(opts);

要全局覆盖函数,请在默认值 (according to the docs) 上调用 set 函数:

$.fn.select2.defaults.set("key", "value")

但是,在我们的代码中,我们这样做:

$.fn.select2.defaults.defaults['language'].searching = function(){
  return 'Custom searching message'
};

我不知道为什么我们不遵循文档,但它确实有效。

【讨论】:

【解决方案2】:

解决方案

这是我找到的解决方案。

v4 之前的版本

初始化

$("input[name='cont_responsible'],input[name='corr_responsible'],input[name='prev_responsible'],input[name='pfmea_responsible']").select2({
            minimumInputLength: 1,
            formatInputTooShort: function () {
                return "Enter 1 Character";
            },  
});

注意

不要忘记在您的文档中添加此代码。准备功能。

       $(document).ready(function () {
});

我分享了我的解决方案,欢迎任何更好的解决方案。

谢谢。

使用 v4 及更高版本

以下内容适用于 V4。 @艾萨克克莱曼 language: { inputTooShort: function () { return ''; } },

【讨论】:

  • 看起来不像。
  • 这在 v4 中适用于我:language: { inputTooShort: function () { return ''; } },
  • 是否可以更改选择对象何时已初始化?
【解决方案3】:

您可以在 4.0 或更高版本上试用此功能 您可以从此链接查看答案参考: issues reference

$("#select2").select2({
    minimumInputLength: 1,
  language: {
    inputTooShort: function() {
        return 'Please Add More Text';
    }
  }
});

【讨论】:

    【解决方案4】:

    如果您使用的是 django-select2,只需在 forms.py 中为您的表单添加属性:

     widget=BookSelect2Widget(
                attrs={'data-minimum-input-length': 1}
                )
    

    【讨论】:

      【解决方案5】:

      覆盖下面的函数行为

      $.fn.select2.defaults = $.extend($.fn.select2.defaults, {
      formatMatches: function(matches) {
          return matches + $filter('translate')('label.matches.found');
      },
      formatNoMatches: function() {
          return $filter('translate')('noMatches.found');
      },
      formatInputTooShort: function(input, min) {
          var n = min - input.length;
          return $filter('translate')('label.please.enter ') + n + $filter('translate')(' more.characters') + (n == 1 ? "" : "s");
      },
      formatInputTooLong: function(input, max) {
          var n = input.length - max;
          return $filter('translate')('please.delete ') + n + $filter('translate')('')('delete.characters') + (n == 1 ? "" : "s");
      },
      formatSelectionTooBig: function(limit) {
          return $filter('translate')('select.only') + limit + $filter('translate')('select.item ') + (limit == 1 ? "" : "s");
      },
      formatLoadMore: function(pageNumber) {
          return $filter('translate')('load.results');
      },
      formatSearching: function() {
          return $filter('translate')('label.search');
      }
      

      }); }

      【讨论】:

        猜你喜欢
        • 2011-10-31
        • 2014-10-08
        • 2020-08-22
        • 2012-06-15
        • 1970-01-01
        • 2013-12-07
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多