0

I have a html page which displays a drop down. drop down is a collection of collections, So i want to use ng-options Problem is i need to preselect a value .Below is the html part of the code

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
    <script type="text/javascript" src="test.js"></script>
</head>
<body>
    <form id="frmTest" ng-app="enc" ng-controller="encMain">
        <select ng-model="SelectedIds" ng-change="manufactureSetup()" ng-options="item as item.ManufactureDate for item in manufactures track by item.ManufactureIds"> </select>
    </form>
</body>
</html>

below is the javascript code

var app = angular.module('enc', []);
app.controller('encMain', function ($scope) {

    $scope.manufactures = [];
    $scope.selectedIds = '';

    function addManufacture(manufactureIds, manufactureDate) {
        return {
            ManufactureIds: manufactureIds,
            ManufactureDate : manufactureDate
        }
    }

    var ids = [1, 2];
    var id1s = [3, 4];

    $scope.manufactures.push(new addManufacture('', 'All Dates'));
    $scope.manufactures.push(new addManufacture(ids, '10JUN2018'));
    $scope.manufactures.push(new addManufacture(id1s, '12JUN2018'));

    $scope.manufactureSetup = function () {
        alert('setup');
    }
});

Problem is i need to preselect "All Dates" in the drop down. Not sure how to achieve this functions. Please help. Thanks

jaiganesh
  • 5
  • 2

0 Answers0