Selected option does not working through jquery

Question

This is my angular with JQuery

mainDodApp.controller('EditPageController', ['$scope', '$http', '$sce', function ($scope, $http, $sce) {
    $http({
        //HTTP Call
    }).success(function (response) {
        $scope.parent_page = $sce.trustAsHtml(response);
    });

    $http({
        //HTTP Call
    }).then(function (response) {
        $scope.formData.parent_page_id = response.data.parent_page_id;
        $('#parentPage option[value='+$scope.formData.parent_page_id+']').attr('selected','selected');
    });

}]);

and this is my HTML.

<select name="parent_pages" id="parentPage" ng-bind-html="parent_page" ng-model="formData.parent_page_id">
</select>

as i am rendering options from ajax call into ng-bind-html and when in second ajax call after getting value for selected option i am selecting option and it is selected also like

<option value="2" selected="selected">About Us</option>

but does not show as default selected value although it has selected attribute. and jquery version is jQuery v1.11.2

check here: http://stackoverflow.com/questions/314636/how-do-you-select-a-particular-option-in-a-select-element-in-jquery — Gurpreet Singh, Jan 12 '17 at 04:55
why not you check this out: https://docs.angularjs.org/api/ng/directive/select — Pankaj Badukale, Jan 12 '17 at 05:11
@RameshRajendran it is already build project i know its poor idea but i just make some changes in this project 70% is written like this — hu7sy, Jan 12 '17 at 05:31
@AnkitVadi it is string and it is also append selected="selected" for selected option but does not show as default option as selected — hu7sy, Jan 12 '17 at 05:33

4b0 · Answer 1 · 2017-01-12T05:24:04.903

0

Try 'prop' function and be sure $scope.formData.parent_page_id return value.

  $('#parentPage option[value='+$scope.formData.parent_page_id+']').prop('selected', true);

Sample fiddle using jQuery v1.11.2

edited Jan 12 '17 at 05:24

answered Jan 12 '17 at 04:56

4b0

21,981
30
95
142

yes i am assure it returned value but solution you give does not work it only work for $('#parentPage option[value='+$scope.formData.parent_page_id+']').attr('selected','selected'); and i can see selected option in DOM as well – hu7sy Jan 12 '17 at 05:00
and it is jQuery v1.11.2 – hu7sy Jan 12 '17 at 05:03

Selected option does not working through jquery

1 Answers1