How to put 'selected' in html options based on data in angularJS?

Question

I am developing an angularJS. Here is my code in PHP:

<label class="item item-input item-select">
    <div class="input-label">Do you have the right to work in UK?</div>
    <select name="do_you_have_the_right_to_work_in_uk" ng-model="do_you_have_the_right_to_work_in_uk">
        <option value="">Select</option>
        <option value="yes" <?php echo $user->do_you_have_the_right_to_work_in_uk == 'yes' ? 'selected' : ''; ?>>Yes</option>
        <option value="no" <?php echo $user->do_you_have_the_right_to_work_in_uk == 'no' ? 'selected' : ''; ?>>No</option>
    </select>
</label>

Considering that the variable {{user_data.do_you_have_the_right_to_work_in_uk}} holds 'yes' or 'no'. What would be the equalent of my PHP code in angularJS?

Shankar Gurav · Accepted Answer · 2016-05-17 09:54:56Z

1

Actualy you don't need to add condition in option select. Instead only setting ng-model="do_you_have_the_right_to_work_in_uk" should have worked as

var app = angular.module('myApp', []);

app.controller('MainCtrl', function($scope) {
  $scope.do_you_have_the_right_to_work_in_uk =  "no"
});

  <script data-require="[email protected]" src="https://code.angularjs.org/1.4.9/angular.js" data-semver="1.4.9"></script>


<body ng-app="myApp" ng-controller="MainCtrl">
  <label class="item item-input item-select">
    <div class="input-label">Do you have the right to work in UK?</div>
    <select name="do_you_have_the_right_to_work_in_uk" ng-model="do_you_have_the_right_to_work_in_uk">
      <option value="">Select</option>
      <option value="yes">Yes</option>
      <option value="no" >No</option>
    </select>
  </label>
</body>

</html>

answered May 17, 2016 at 9:54

Shankar Gurav

1,0779 silver badges17 bronze badges

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

Comments

Deepak Adhikari · Accepted Answer · 2016-05-17 09:45:44Z

0

Instated of selected only use selected="selected". This adds selected attribute to the option.

<option value="yes" <?php echo $user->do_you_have_the_right_to_work_in_uk == 'yes' ? 'selected="selected"' : ''; ?>>Yes</option>

answered May 17, 2016 at 9:45

Deepak Adhikari

4172 silver badges4 bronze badges

Comments

mtamma · Accepted Answer · 2016-05-17 09:59:37Z

0

use ng-selected

<select name="do_you_have_the_right_to_work_in_uk" ng-model="do_you_have_the_right_to_work_in_uk">
  <option value="">Select</option>
  <option value="yes" ng-selected="do_you_have_the_right_to_work_in_uk === 'yes'">Yes</option>
  <option value="no" ng-selected="do_you_have_the_right_to_work_in_uk === 'no'">No</option>
</select>

answered May 17, 2016 at 9:59

mtamma

5334 silver badges6 bronze badges

Collectives™ on Stack Overflow

How to put 'selected' in html options based on data in angularJS?

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related