3

Hide the term id on autocomplete widget

How can I hide the term id on autocomplete widget ?

I use drupal 8.

3

There is no built-in option to hide term ID from entity_autocomple form element. Its behavior is simple, if there is a term that match then shows (TID).

|improve this answer|||||
2

Here is the trick to hide Reference EntityID using Javascript/jQuery.
This is not a proper way to hide it, but it works.

jQuery("body").find('.form-autocomplete').change(function() {
            var val = jQuery(this).val();
            var match = val.match(/\((.*?)\)$/);
            if (match) {
                jQuery(this).data('real-value', val);
                jQuery(this).val(val.replace(' ' + match[0], ''));
            }
        });
|improve this answer|||||
1

For Drupal 8 I would adjust your code a bit to remove the number after selecting the suggested value, not after user click outside the input:

    jQuery("body").find('.form-autocomplete').on('autocompleteclose', function(event, node) {
  var val = jQuery(this).val();
  var match = val.match(/\((.*?)\)$/);
  if (match) {
    jQuery(this).data('real-value', val);
    jQuery(this).val(val.replace(' ' + match[0], ''));
  }
});
|improve this answer|||||
0

Similar to other jQuery-related answers, you could add an function and call it for each form field or an entire form:

    function autocomplete_tid_remove(field){

        var autocomplete_tid = $(field);

        var autocomplete_tid_stripped = $(autocomplete_tid).val().split(" ")[0];    

        $(field).val(autocomplete_tid_stripped);    

    }

    var selector = "[**put form id here**]";

    autocomplete_tid_remove(selector + " .form-autocomplete");
|improve this answer|||||
0

Here is a complete js file for removing TID's onload and onchange

(function($, Drupal, drupalSettings){
'use strict';

 Drupal.behaviors.my_module = {
   attach: function(context) {

  // Remove TID's onload.
  Drupal.my_module.remove_tid();

  // Remove TID's onchange.
  jQuery('body').find('.form-autocomplete').on('autocompleteclose', function() {
    Drupal.my_module.remove_tid();
  });
}
};

Drupal.my_module = {
  remove_tid: function () {
    let field_autocomplete = jQuery('body').find('.form-autocomplete');
    let autocomplete_tid_stripped = field_autocomplete.val().split(' ')[0];
    field_autocomplete.val(autocomplete_tid_stripped);
  },
};

})(jQuery, Drupal, drupalSettings);
|improve this answer|||||
0

I have done small changes in code and working fine for me. thank's

(function($, Drupal, drupalSettings){
  'use strict';

  Drupal.behaviors.common = {
    attach: function(context) {
      // Remove TID's onload.
      Drupal.common.remove_tid();

      // Remove TID's onchange.
      jQuery('body').find('.form-autocomplete').on('autocompleteclose', function() {
        Drupal.common.remove_tid();
      });
    }
  };

  Drupal.common = {
    remove_tid: function () {
      var field_autocomplete = jQuery('body').find('.form-autocomplete');
      field_autocomplete.each(function (event, node) {
        var val = $(this).val();
        var match = val.match(/\((.*?)\)$/);
        if (match) {
          $(this).data('real-value', val);
          $(this).val(val.replace(' ' + match[0], ''));
        }
      });

    }
  };
})(jQuery, Drupal, drupalSettings);
|improve this answer|||||

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.