Form fields / Placeholder and value

Question

I have this form field which I want to change if a condition is true.

<input type="email"
  name="UserEmail"
  id="UserEmail"
  class="form-control"
  ng-class="{'invalid-signup': signUpForm.UserEmail.$invalid && signUpForm.UserEmail.$dirty, 'valid-signup': signUpForm.UserEmail.$valid && signUpForm.UserEmail.$dirty}"
  placeholder="Primary contact email."
  ng-required="true"
  ng-maxlength="30"
  ng-minlength="5"
  ng-model="signUpModel.UserEmail"/>
 <div ng-show="signUpForm.UserEmail.$dirty && signUpForm.UserEmail.$invalid">
  <p ng-show="signUpForm.UserEmail.$error.required">Email is required.</p>
  <p ng-show="signUpForm.UserEmail.$error.pattern">Email is not valid.</p>
  <p ng-show="signUpForm.UserEmail.$error.minlength">Email is too short, min 5 characters.</p>
  <p ng-show="signUpForm.UserEmail.$error.maxlength">Email is too long, max 30 characters.</p>
</div>

So I have one flag variable and if that is true I want to change the field placeholder and value into something.

$scope.isGoogleLoginWorking = true;

Is there any way for doing that.

Thanks in advice.

Vivz · Accepted Answer · 2017-08-23T11:14:08.627

1

You can use a ternary operator

<input type="email"
  name="UserEmail"
  id="UserEmail"
  class="form-control"
  ng-class="{'invalid-signup': signUpForm.UserEmail.$invalid && signUpForm.UserEmail.$dirty, 'valid-signup': signUpForm.UserEmail.$valid && signUpForm.UserEmail.$dirty}"
  placeholder="{{isGoogleLoginWorking?'Primary contact email.':'Something else'}}"
  ng-required="true"
  ng-maxlength="30"
  ng-minlength="5"
  ng-model="signUpModel.UserEmail" ng-value="isGoogleLoginWorking?signUpModel.UserEmail:'Something else'"/>

edited Aug 23 '17 at 11:14

answered Aug 23 '17 at 11:08

Vivz

6,625
2
17
33

Is there other way that I can do it using java script because I'll need to include another condition and I'll get complicated. – Jovan Aug 23 '17 at 11:16
You can call a function and do the calculations in your function. What exactly are your requirements? – Vivz Aug 23 '17 at 11:21
I'd like to call the field by id and to assign the values inside the function for example getTagById("something"). Because later I'll include Facebook , Microsoft login so I don't want the user to be directly logged in I want to show the user data and then If he is happy to press sign up and that is why I i need the placeholder and value. – Jovan Aug 23 '17 at 11:31
Then you can write a custom directive which captures the required field by id and manipulates its placeholder and value – Vivz Aug 23 '17 at 11:32
Can you please send and example of that. – Jovan Aug 23 '17 at 11:34
Try reading https://stackoverflow.com/questions/14777841/angularjs-inputplaceholder-directive-breaking-with-ng-model and https://stackoverflow.com/questions/17713137/change-value-of-input-placeholder-via-model – Vivz Aug 23 '17 at 11:40

Form fields / Placeholder and value

1 Answers1