Send data to controller on ui.select angular

Question

i'm trying to select a value from dropdown list and get the data from corresponded select id in angularJs

i have came up with angular-ui/ui-select directives

<ui-select ng-model="customer" theme="selectize">
     <ui-select-match placeholder="Customer List">{{$select.selected.Name}}</ui-select-match>
        <ui-select-choices repeat="customer in customers | filter: $select.search">
            <span ng-bind-html="customer.Name | highlight: $select.search"></span>
            <small ng-bind-html="customer.Id.toString() | highlight: $select.search"></small>
        </ui-select-choices>
</ui-select>

on my controller i have get customer method

$scope.setActiveCustomer = function(customer) {
  customersService.getCustomers(customer).then(function(response) {
    $scope.selectedCustomer = response;
  });
};

my problem is

once i select the customer which event should i use for fire setActiveCustomer (like onchange or something). when i use ng-click event fired many time because ng-click using to control activate.
other thing is how can i set initial value for ui-select ?

thanks

runTarm · Accepted Answer · 2014-08-15 11:36:45Z

7

According to the ui-select FAQ, your ng-model expression should have a . in it, for example:

<ui-select ng-model="model.customer" theme="selectize">

To set the initial value, you could just set the property specified in the ng-model, so in your controller:

$scope.model = {
  customer: $scope.customers[0] // set the initial selected option
};

For the onchange event, you could use $scope.$watch() like this:

$scope.$watch('model.customer', function (customer) {
  $scope.setActiveCustomer(customer);
});

Hope this helps.

answered Aug 15, 2014 at 11:36

runTarm

11.6k1 gold badge39 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Gayan Over a year ago

Hi runTarmit solved my first problem amazingly but still i'm stucked with second one

runTarm Over a year ago

Do you mean setting an initial value?

Gayan Over a year ago

yep. initial value not assign as expected!!

runTarm Over a year ago

Could you please show how use set the $scope.model.customer? Is the $scope.customers available at that time?

Gayan Over a year ago

yes it's available but when it bind to select ui it's only shows [object Object] i have check those objects using firebug it shows initial binded object was [Object { Id=1, Name="FirstOne"}] but it should be something like Object { Id=1511, Name="FirstOne", $$hashKey="00H"}

Collectives™ on Stack Overflow

Send data to controller on ui.select angular

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related