0

When i am changing my option value of select it's ng-model value is not being changed. Is this happening because of value is being changed by Jquery? Because i read a line about angularjs from w3school that The ng-change event is only triggered if there is a actual change in the input value, and not if the change was made from a JavaScript.

And i want to clarify that option value is being changed by j query.

Please suggest me proper solution or tell me error in the code.

Here is my html

<div class="row" ng-app="myapp" ng-controller="mycontroller" id="mainController">
    <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
        <div class="form-group">
            <p>Rooms
                <% no_of_rooms %>
            </p>
            <select ng-init="no_of_rooms='1'" autocomplete="off" ng-model="no_of_rooms" class="form-control" id="no_of_rooms" style='display:none' name="no_of_room" style="height: 39px !important;">
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>
                <option value="4">4</option>
                <option value="5">5</option>
                <option value="6">6</option>
            </select>
        </div>
    </div>

    <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12" ng-repeat="i in getNumber(no_of_rooms) track by $index">
        <div class="form-group">
            <p>Adult (12+ YRS)</p>
            <select autocomplete="off" class="form-control" style='display:none' name="no_of_adults[]" style="height: 39px !important;">
                <option value="0">0</option>
                <option value="1" Selected>1</option>
                <option value="2">2</option>
                <option value="3">3</option>
                <option value="4">4</option>
                <option value="5">5</option>
                <option value="6">6</option>
                <option value="7">7</option>
                <option value="8">8</option>
            </select>

        </div>
    </div>
</div>

Here is my script.

var app = angular.module('myapp', [], function($interpolateProvider) {
    $interpolateProvider.startSymbol('<%');
    $interpolateProvider.endSymbol('%>');
});
app.controller('mycontroller', function($scope , $filter) {
 $scope.getNumber = function(num) {
        return new Array(parseInt(num));   
    }
});
2
  • Your using two select-box and those are hiding from screen.Could you please explain why you are hiding the select box. on which event your changing the value. Commented Jun 2, 2019 at 4:53
  • cause js is being applied on these and ul and li is being generated and i don't want to show both. Commented Jun 3, 2019 at 5:12

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.