Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

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

More options #6263

Open
wants to merge 9 commits into
base: develop
Choose a base branch
from
Open

More options #6263

wants to merge 9 commits into from

Conversation

zkelo
Copy link

@zkelo zkelo commented Jul 19, 2023

This pull request includes:

  • Bug fix
  • New feature
  • Translation

The following changes were made:

  • Added new option searchDecorator;
  • Added documentation for new option.

This PR helps to solve my issue #6262 by adding special option for specifying search decorator. Using this I can define custom search decorator and easy pass it to widget.

This is how I did it with new option:

// Decorator definition
$.fn.select2.amd.define('CustomSearch', [
    'select2/selection/search',
    'select2/utils'
], function (Search, Utils) {
    function CustomSearch (decorated, $element, options) {
        decorated.call(this, $element, options);
    }

    Utils.Extend(CustomSearch, Search);

    CustomSearch.prototype.searchRemoveChoice = function (decorated, item) {
        this.trigger('unselect', {
          data: item
        });

        this.$search.val(item.text.substr(0, item.text.indexOf('<') - 1));
        this.handleSearch();
    };

    return CustomSearch;
});

// Init select2
$('#books').select2({
    width: 500,
    multiple: true,
    data: [
        {
            id: 1,
            text: 'First book <span style="display: none;">one 1</span>'
        },
        {
            id: 2,
            text: 'Second book <span style="display: none;">two 2</span>'
        },
        {
            id: 3,
            text: 'Third book <span style="display: none;">three 3</span>'
        }
    ],
    escapeMarkup(data) {
        return data;
    },
    searchDecorator: $.fn.select2.amd.require('CustomSearch')
});

I think it will be useful not only for me so I made this PR. Also I can add more similar options and documentation for them if this will be useful.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

1 participant