CODEWITHSUNDEEP
angularjs
StudentRik
StudentRik

Reputation: 1049

Set value of multiple dropdowns

I am trying to set the value of many select elements when a user presses a button.

I have tried the jQuery way: 

    vm.passAllInspections = function ($event) {
    $(".tbl-inspections option[value=pass]").attr("selected", "selected");
        console.log($event);
    }

This works but does not update ng-model or even make it fire. I looked at this post which gives details on the input element. I could not get the trigger event to happen?

$('button').click(function(){
var input = $('input');
input.val('xxx');
input.trigger('input');
});

So then I tried to use the $compile directive $compile(vm)($scope); that doesn't work as I wasn't sure if it had to be the exact ng-model property?

Then I was looking at useing ng-click="vm.eicr.inspections='pass'" but wasn't sure how to apply it to every ng-model property.

How can I press a button and add pass to a list of dropdowns and fire the ng-model so the properties are all set.

Upvotes: 1

Views: 23

Answers (1)

Jordumus
Jordumus

Reputation: 2783

You have your listbox:

<select data-ng-model="myValue">
   <option value="1">value 1 </option>
   <option value="2">value 2 </option>
   <option value="3">value 3 </option>
</select>

You have a button:

<button data-ng-click="setListboxToValue('2')" value="Click me!"/>

When you click the button, you trigger this function:

$scope.setListboxToValue = function(value) {

   $scope.myValue = value;
}

This will set your listbox to the value you want.

Full example code: jsFiddle

Upvotes: 1

Related Questions