AngularJs Drop-down Get Selected Items Value

How to get selected drop-down value in angularjs?


The JavaScript code sample as given below.

<script>
var app = angular.module('addConnectionApp', [])
app.controller('addConnectionCtrl', function ($scope) {
    $scope.companies = [{
        id: '1',
        name: 'ViaIndia'
    }, {
        id: '2',
        name: 'Invia'
    }, {
        id: '3',
        name: 'Dominos'
    }, {
        id: '4',
        name: 'Pizza'
    }];

    $scope.tents = [{
        id: '1',
        name: 'Optus'
    }];


    $scope.fName = null;
    $scope.lName = null;
    $scope.mobile = null;
    $scope.email = null;
    $scope.tenantId = 1;//This is defeult selected item.
    $scope.companyId = 1;//This is defeult selected item.
    $scope.accountNo = null;
    $scope.imsi = null;
    $scope.imei = null;
    $scope.message = null;

    $scope.addServices = function () {
        var self = $scope;
        var service = {
            FirstName: self.fName,
            LastName: self.lName,
            MobileNo: self.mobile,
            EmailID: self.email,
            IMSI: self.imsi,
            IMEI: self.imei,
            AccountNo: self.accountNo,
            Region: self.accountNo,
            TenantID: self.tenantId,
            CompanyID: self.companyId
        };
        alert(JSON.stringify(service));
    }
});
</script>

The HTML code sample as given below.

<div class="row" ng-app="addConnectionApp" ng-controller="addConnectionCtrl">
<div class="large-12 columns">
<div class="row">
<div class="large-12 columns">
<h1 class="heading-primary">New Connection</h1>
<div class="intro-primary">                 
<input type="text" ng-model="fName" placeholder="First Name" required />
<input type="text" ng-model="lName" placeholder="Last Name" required />
<input type="number" ng-model="mobile" maxlength="12" placeholder="MobileNo" required />
<select ng-model="tenantId">
    <option data-ng-repeat="ten in tents" value="{{ten.id}}">{{ten.name}}</option>
</select>
<select ng-model="companyId">
    <option data-ng-repeat="comp in companies" value="{{comp.id}}">{{comp.name}}</option>
</select>
<input type="text" ng-model="accountNo" placeholder=" company account no." required />
<input type="email" ng-model="email" placeholder="Email" required />
<input type="text" ng-model="imsi" placeholder="IMSI" required />
<input type="text" ng-model="imei" placeholder="IMEI" required />
<textarea ng-model="message" placeholder="Message"></textarea>
<div class="hide-for-small">
    <a class="button radius small yellow right" ng-click="addServices();">Create New Connection</a>
</div>
</div>
</div>
</div>
</div>


</div>
ANIL SINGH

Anil Singh is an author, tech blogger, and software programmer. Book writing, tech blogging is something do extra and Anil love doing it. For more detail, kindly refer to this link..
My Blogs - https://code-sample.com and https://code-sample.xyz
My Book1 - BEST SELLING ANGULAR BOOK (INCLUDING ALL VERSIONS 2, 4, 5, 6, 7)
My Book2 - ANGULAR 2 INTERVIEW QUESTIONS BOOK - Both Books are Available on WorldWide.

www.code-sample.com/. Powered by Blogger.