[4.0.3] No way to update placeholder when data-placeholder is preset · Issue #4653

link管理

链接快照平台

输入网页链接，自动生成快照
标签化管理网页链接

相关文章推荐

爱玩的登山鞋 · 第990章 ...· 2 月前 ·

知识渊博的啄木鸟 · 古剑奇谭三挑战模式全关卡全BOSS图文攻略_技能· 4 月前 ·

爱听歌的凉面 · ASP.NET Core 中的 Razor ...· 4 月前 ·

爱喝酒的草稿纸 · 微密圈左公子666图集资源，百度云下载最新合 ...· 5 月前 ·

越狱的炒面 · I tried to upload a ...· 6 月前 ·

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement . We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

I was trying:
$("select[name='paid_by']").select2({ placeholder: "xxxxxxxxxx", allowClear: true }).attr("disabled", false);
$("select[name='paid_by']").attr("data-placeholder","bar").select2({ placeholder: "updated text..." });

It doesn't work when data-placeholder is preset in HTML. But everything is working fine when I remove data-placeholder...

Ok, I've found the solution:
$("select[name='paid_by']").data('placeholder', 'updated text...').select2();

but, there should by any method to change placeholder without reinitialize select2.

~~No way to update placeholder when data-placeholder is preset~~ [4.0.3] No way to update placeholder when data-placeholder is preset

Oct 25, 2016

Maybe I found a solution (it's not sure at all, so if you can test and told me if it's work):

  // your select element
  var $el = $('select_id');
  // change placeholder in select2
  $el.data('select2').selection.placeholder.text = text;
  // change placeholder in dom
  $el.next("span.select2:first").find("span.select2-selection__placeholder").html(text);

I'm using this for now..

$.fn.Select2GetPlaceholder = function () {
    var $select2Container = $(this).data('select2').$container;
    return $select2Container.find('.select2-selection__placeholder').text();
$.fn.Select2UpdatePlaceholder = function (newPlaceholder) {
    // $(this).select2({
    //     placeholder: novoPlaceholder
    // });
    var $select2Container = $(this).data('select2').$container;
    return $select2Container.find('.select2-selection__placeholder').text(newPlaceholder);
var placeholderValue = $("#hue").Select2GetPlaceholder();
$("#huehue").Select2UpdatePlaceholder(placeholderValue );
          @avernet I'm not sure if your update addresses this feature request. I'm still not able to dynamically update the placeholder without re-initiating the select element.
@PatrikGuerra's extensions do the trick for now, but it feels hack-y.
          @avernet on the thread it says you "mentioned this issue" attached to this thread (that looks like an update): orbeon/orbeon-forms#1433

Apologies if I've misunderstood!
          @dearsina Got it, some time has passed, and my memory of this had faded ;). In Orbeon Forms, we're just reinitializing the Select2 when the placeholder changes, and using a MutationObserver to know when that attribute changes. In practice, this happens when users change the current language, and hence the placeholder changes. You can see the code updating the placeholder (initOrUpdatePlaceholder) being hooked to the MutationObserver here. The code is in Scala.js, but I imagine you can get the gist of it. I hope this helps!
          Combination of @PatrikGuerra and @alkana approaches works well for me:
$.fn.Select2UpdatePlaceholder = function (newPlaceholder) {
    var $select2 = $(this).data('select2');
    $select2.selection.placeholder.text = newPlaceholder;
    return $select2.$container.find('.select2-selection__placeholder').text(newPlaceholder);