JD06
JD06

Reputation: 191

Trouble with AngularJS ui-select

I am trying to replace an existing select element (a standard drop down list) with the AngularJS ui-select directive. Everything is almost working, except when I choose an option from the list, it does not update the model (it is not detecting what I have chosen).

Here is the code in my partial view:

<ui-select ng-model="shipaddress.selected" theme="bootstrap">
    <ui-select-match placeholder="Enter address or start typing...">
        {{$select.selected.AddressName}}
    </ui-select-match>
    <ui-select-choices repeat="sa in shipaddresses | filter: $select.search">
        {{sa.AddressName}} ({{sa.Street1}})
    </ui-select-choices>
</ui-select>

Here is the code that I am trying to replace:

<select name="shippingAddress" ng-change="setShipAddressAtOrderLevel()" ng-options="address.ID as address.AddressName for address in shipaddresses" ng-model="currentOrder.ShipAddressID" ng-required="!currentOrder.IsMultipleShip()">
 <option value=""></option>
</select>

Also, I have set the below in my controller (empty object):

$scope.shipaddress = {};

Any guidance would be greatly appreciated. Thank you!

Upvotes: 0

Views: 60

Answers (1)

Ragul Parani
Ragul Parani

Reputation: 621

If you read the documentation of the ui-select you will find the on-select attribute which will call a function. You can use that function to do whatever you are trying to do. For reference you can see the Documentation

Upvotes: 1

Related Questions