user2598687
user2598687

Reputation: 95

Angular JS and Bootstrap Multiselect Mixin not working on Non-webkit browsers

I have combined Bootstrap multiselect and angular js in order to create a angular powered multiselect dropdown. However, it is working only on Webkit browsers. On the non-webkit browsers, the checkboxes/radiobuttons of Bootstrap multiselect are not getting selected upon click.

You can view a running example from this js fiddle. http://jsfiddle.net/58Bu3/1/

<select class="multiselect" data-placeholder="Select Products" 
            ng-model="productSelection" ng-options="item as item for item in Products"
            multiple="multiple" multiselect-dropdown >

            </select>
<p>Selection: {{productSelection}}</p>

Upvotes: 1

Views: 1397

Answers (2)

Miss_K
Miss_K

Reputation: 194

If you change this:

   onChange: function (optionElement, checked) {
        optionElement.removeAttr('selected');
        if (checked) {
            optionElement.attr('selected', 'selected');
        }
        element.change();
    }

to this:

onChange: function (optionElement, checked) {
            optionElement.prop('selected'), false;
            if (checked) {
                optionElement.prop('selected', true);
            }
            element.change();
        }

It will work in Firefox, IE & Chrome.

Upvotes: 1

Rajeev
Rajeev

Reputation: 1113

Comment the

 onChange: function (optionElement, checked) {

   }

It will Work.

Upvotes: 1

Related Questions