CODEWITHSUNDEEP
javascriptjqueryangularjs
clestcruz
clestcruz

Reputation: 1111

Getting the value inside a textbox ng-model using javascript .value

I'm currently confuse in trying to obtain the value inside a text box using jquery .value

<input class="input referral-code" disabled="true" ng-model="account.referral_code_string" id="input-refcode">

I tried using document.getElementById('input-refcode').value to try to obtain the value but it comes out as empty on my console.

But if I tried binding it onto a on-click event, it manages to obtain the value stored inside the ng-model

$('.trigger').on('click', function(){
   console.log(document.getElementbyId('input-refcode'))
});

As you can see there is a value inside the text box itself. But when you tried inspecting it, this is what came out.

<input class="input referral-code" disabled="true" ng-model="account.referral_code_string" id="input-refcode">

If you look at there is no value inside the input textbox. I'm not sure if it has something to do with angular.js

enter image description here

Upvotes: 1

Views: 2236

Answers (3)

sumit chauhan
sumit chauhan

Reputation: 1300

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

        $scope.$watch('referral_code_string'), function(){ console.log($scope.referral_code_string)};
    
     console.log(document.getElementById('input-refcode').value);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="todoApp" ng-controller="TodoListController as todoList">
<input class="input referral-code" disabled="true"  ng-model="referral_code_string"  ng-init="referral_code_string = 'abc'" id="input-refcode" value="abc">
</div>

Upvotes: 0

D C
D C

Reputation: 748

This might help you.

inject $timeout service in controller

$timeout(function(){
 console.log(document.getElementById('input-refcode')); },200);

Note: Use capital B in getElementById not getElementbyId.

Upvotes: 0

Satpal
Satpal

Reputation: 133453

You can get the scope object using element

var scope =  angular.element(document.getElementById('input-refcode')).scope();
var desiredValue = scope.account.referral_code_string;

Upvotes: 1

Related Questions