Autocomplete Ajax itemUnselect is not working in Pandora 2.0.0 with PFX

Post Reply
koichokor
Posts: 3
Joined: 01 Jan 2016, 23:01

26 Aug 2021, 20:46

Hi,
We implemented an Autocomplete element with itemSelect and itemUnselect Ajax events to save the actions. The Ajax itemSelect handling event works. But when clicking on the 'X' icon to remove/unselect an item, the following error showed up in Firefox Console:

Code: Select all

components.js.xhtml?ln=primefaces&v=10.0.4&e=10.0.4:formatted:1324 Uncaught TypeError: c.attr is not a function
    at c.removeItem (components.js.xhtml?ln=primefaces&v=10.0.4&e=10.0.4:formatted:1324)
    at HTMLSpanElement.<anonymous> (layout.js.xhtml?ln=pandora ...
    

Code: Select all

 removeItem: function(c) {
        var d = this
          , e = "";
        if (d.input.hasClass("ui-state-disabled")) {
            return
        }
        if (typeof c === "string" || c instanceof String) {
            e = c
        } else {
            e = c.attr("data-token-value") // Error at this line
        ....
When i remove this part of layout.js (shipped with the theme) is work as expected :

Code: Select all

if(PrimeFaces.widget.AutoComplete) {
    PrimeFaces.widget.AutoComplete.prototype.setupMultipleMode = function() {
        var $this = this;
        this.multiItemContainer = this.jq.children('ul');
        this.inputContainer = this.multiItemContainer.children('.ui-autocomplete-input-token');

        this.multiItemContainer.hover(function() {
                $(this).addClass('ui-state-hover');
            },
            function() {
                $(this).removeClass('ui-state-hover');
            }
        ).click(function() {
            $this.input.focus();
        });

        //delegate events to container
        this.input.focus(function() {
            $this.multiItemContainer.addClass('ui-state-focus');
            $this.jq.addClass('md-inputwrapper-focus');
        }).blur(function(e) {
            $this.multiItemContainer.removeClass('ui-state-focus');
            $this.jq.removeClass('md-inputwrapper-focus').addClass('md-inputwrapper-filled');
            
            setTimeout(function() {
                if($this.hinput.children().length == 0 && !$this.multiItemContainer.hasClass('ui-state-focus')) {
                    $this.jq.removeClass('md-inputwrapper-filled');
                }
            }, 150); 
        });

        var closeSelector = '> li.ui-autocomplete-token > .ui-autocomplete-token-icon';
        this.multiItemContainer.off('click', closeSelector).on('click', closeSelector, null, function(event) {
            if($this.multiItemContainer.children('li.ui-autocomplete-token').length === $this.cfg.selectLimit) {
                if(PrimeFaces.isIE(8)) {
                    $this.input.val('');
                }
                $this.input.css('display', 'inline');
                $this.enableDropdown();
            }
            $this.removeItem(event, $(this).parent());
        });
    };
};
Same problem in this post : viewtopic.php?p=193634#p193634

PF Version : 10.0.4 (Elite subscription)
Theme : Pandora (2.0.0)

siris
Posts: 322
Joined: 29 Jul 2019, 13:57

27 Aug 2021, 09:01

Hi,

Yes, there is such a code to support some features in previous versions. I think it conflicts on PrimeFaces 10. In the new version we will add version if controller or remove this code. I'm glad your issue was resolved.

Best Regards,

Post Reply

Return to “Pandora - PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest