VIKAS KOHLI VIKAS KOHLI -4 years ago 115
AngularJS Question

Want to keep 91 disabled using AngularJs in input field

HTML FILE

page.html

<form autocomplete="off" name="form" ng-submit="form.$valid && submitRequest();">
<input type="tel" minlength="10" maxlength="10" name="userPhone" class="form-control height40"
ng-model="user.phone" ng-click="insertCounryCode();"

placeholder="* Your 10 digit Mobile Number" ng-disabled="disabledVal"
required>
<button type="submit" class="btn btn-default request_call_submit form-control">Request Callback</button>
</form>


Now JS FIle

// app.js

// Controller

$scope.user = {};


$scope.insertCounryCode = function () {
$scope.user.phone = "+91";
}

$scope.submitRequest = function () {
// Submitting user response
}


I am able to add +91 when the user clicks on this input field but I want this field to be disabled so that user don't able to change +91.
Only the user can change only the enter mobile number only

Will any one tell how Can I do that using AngularJs ?

Answer Source

I have added a fiddle for this requirement. We can do this through CSS. Please check the fiddle. Fiddle. Thanks. Let me know if this is ok for your requirement. Adding my CSS and HTML here

.input-box { position: relative; }

input { display: block; border: 1px solid #d7d6d6; background: #fff; padding: 10px 20px 10px 30px; width: 195px; }

.unit { position: absolute; display: block; left: px; top: 10px; z-index:  9; }



<div class="input-box">
  <input value="" autofocus="autofocus"/>
  <span class="unit">+91</span>
</div>
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download