webdev5
webdev5

Reputation: 487

AngularJS: Sort on a multi select

I have a filter working on the multi select but when I try what I saw on the following link it doesn't work:

https://docs.angularjs.org/api/ng/filter/orderBy

How do I get the sort to change by clicking on the glyphicon?

Visual of the page

<div>
        <label>Available</label>
        <label style="float: right; position: relative; left: 141px;">Assigned</label><br />
        <input type="text" ng-model="filterText" style="width: 50px; position: relative; left:-36px;"/>
        <button style="position: relative; left: -30px;">Filter</button>
        <div style="position: relative; top: 0px; left: 311px; float: left;">
            <a href="" ng-click="reverse=!reverse;order('name', reverse)"><span  class="glyphicon glyphicon-sort-by-attributes-alt"></span></a>
            <a href="" ng-click="reverse=!reverse;order('name', reverse)"><span class="glyphicon glyphicon-sort-by-attributes"></span></a>
        </div>
        <br />
        <select id="available-groups"  multiple>
            <option value="{{group._id}}"  ng-repeat="group in rbacGroups | filter:filterText">{{group.name}}</option>
        </select>
        <button id="addGroup" style="position: relative; top: -72px; left: 21px;">Add &raquo;</button><br />
        <button id="removeGroup" style="position: relative; top: -72px; left: 375px;">&laquo; Remove</button>
        <br />
        <select id="assigned-groups" ng-model="cgroups"  multiple required="required">

        </select>
    </div>

Upvotes: 0

Views: 1274

Answers (1)

m1kael
m1kael

Reputation: 2851

Change

ng-repeat="group in rbacGroups | filter:filterText"

to

ng-repeat="group in rbacGroups | filter:filterText | orderBy:'name':reverse"

and also change

<a href="" ng-click="reverse=!reverse;order('name', reverse)">...
<a href="" ng-click="reverse=!reverse;order('name', reverse)">...

to

<a href="" ng-click="reverse=false">...
<a href="" ng-click="reverse=true">...

Upvotes: 2

Related Questions