Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Loading…

Select2 directive not compatible with new select2 versions (released 3.3, upcoming 3.4) #407

Closed
ni-ka opened this Issue · 9 comments

5 participants

@ni-ka

Hey,

Due to some required bugfixes I've tried to update the select2 component in my angular UI project. However, the freshly released 3.3 does not work with angular UI, and so does the master version.

Both have slightly different bugs, here plunkers:

released 3.3: http://plnkr.co/edit/wQGLMYFJyeQxYQq0pe8o?p=preview
upcoming 3.4 / master: http://plnkr.co/edit/7Dd41eVVInSSQCx4SCAJ?p=preview

@ProLoser
Owner

.attr(key, val) is returning the value instead of a reference to the jQuery wrapped DOM element. This may be caused by AngularJS itself, and if so, you might want to open a ticket there instead.

In the mean time, what happens if you modify the select2 code (for shits and giggles) so that .attr() is the last method in the chain instead of second to last?

@nicolasblanco

Hi,

what is the latest version of select2 compatible with angular UI ? Thanks.

@ProLoser
Owner

@slainer68 Trying to figure out WHY it's not compatible with the latest version, as I can't seem to understand why it wouldn't be.

@nicolasblanco

@ProLoser : thanks.

In my case, when I'm using the angular ui select2 directive, the directive makes more than 1 select() call on the element, and on the second call, the select2 input disappears offscreen (you can reproduce the behaviour by just manually calling select2() twice on an element)...

@ni-ka

@slainer68 you can safely use 3.2

@ProLoser regarding your first reply, this only seems to be valid for 3.3, right? 3.4 does not show any javascript error. It seems that it is hiding the wrong item (the select2-offscreen class gets applied to the container div instead of the drop only). If you remove the select2-offscreen class from the container the control is working fine.

I believe the problem is along these lines (around line 549)

if (opts.element.attr("class") !== undefined) {
    this.container.addClass(opts.element.attr("class").replace(/validate\[[\S ]+] ?/, ''));
}

this.container.css(evaluate(opts.containerCss));
this.container.addClass(evaluate(opts.containerCssClass));

this.elementTabIndex = this.opts.element.attr("tabIndex");

// swap container for the element
this.opts.element
    .data("select2", this)
    .addClass("select2-offscreen")
    .bind("focus.select2", function() { $(this).select2("focus")})
    .attr("tabIndex", "-1")
    .before(this.container);
@nicolasblanco

@ni-ka : i don't understand why but my select2 goes off screen when using the directive even with v.3.2 :cry:

@Etdashou

Hi, I have the exact problem @ni-ka mentionned. Playing around with Firebug, I discovered that my select2 dropdown wasn't there because the class select2-offscreen was applied to the Div. I am now back to select 2 3.2.

@ProLoser
Owner

AngularUI is currently undergoing a restructure. This project will no longer hold the codebase, can you please relocate this to https://github.com/angular-ui/ui-select2 (after confirming it's still necessary with the latest code)?

@johntom
@ProLoser ProLoser closed this
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.