We Keep Coding

Disable Chrome's saved credit card info on an input field

I am having trouble disabling Chrome's payment method dropdown that is supposed to appear when you click in the credit card field but it is appearing when you click in a subject input field. Please note, the HTML is generated automatically and cannot be edited directly, I will need to adjust using JS.
<form>
<div id="subject_row" class="form-row form-text eCardFields show">
<div class="form-content">
<span class="field-required"></span>
<label for="ecard_subjectname">Subject: *</label>
<input type="text" name="ecard_subjectname" id="ecard_subjectname" value="" maxlength="50" placeholder="disabled only for this component">
<input type="hidden" name="ecard_subjectsubmit" id="ecard_subjectsubmit" value="true">
</div>
</div>
</form>
This is what I have tried:
//attempt 1
$('#ecard_subjectname').attr('autocomplete', 'new-password');
//attempt 2
$('#ecard_subjectname').attr('autocomplete', 'off');

Try using terrylinooo's disableAutoFill for jQuery: https://github.com/terrylinooo/jquery.disableAutoFill

Change bootstrap form based on the users active input. Display a change in the form only based on the text entered and no button clicks

Like credit card logo pops up as you enter in your credit card number. Instead of a logo I want to display a change in the form without a button click. Form automatically detects change after the input field has been filled.

Simple example:
In Angularjs
$scope.changeStyle=function(){
$scope.color="red";
}
<form>
<div class="form-group">
<label for="exampleInputEmail1">Email address</label>
<input type="email" class="form-control" ng-model="someName" ng-change="changeStyle()" id="exampleInputEmail1" ng-style="{'color':color}"
placeholder="Email">
</div>
<button type="submit" class="btn btn-default">Submit</button>
</form>

Unable to enter text in angular text box

I am using the below input text box tag in 2 different templates.
<div class="text-input">
<input type="text" class="form-control" id="" placeholder="">
</div>
In the first template i am able to enter text. But when i change the view to the second template, i am unable to enter text in the text box. Again when i go back to the first template, I am not able to enter text.
I have noticed in the console that both the text box are in the below state initially (before clicking in the text box to enter text):
<input type="text" class="form-control ng-pristine ng-valid ng-empty ng-touched" id="" placeholder="" style="">
When text entering is possible, the class is updated to
<input type="text" class="form-control ng-valid ng-touched ng-not-empty ng-dirty ng-valid-parse" id="" placeholder="" >
There is no change in class when it is disabled.
What is the possible problem and how can i fix this?
Edits :
<form class="view-tools ">
<ng-include src="'views/view1.tpl.html'"></ng-include>
</form>
<form class="view-tools ">
<ng-include src="'views/view2.tpl.html'"></ng-include>
</form>
i have a function in the controller which basically sets scope variables to true or false to show/hide the views.

Try adding both a required and a ng-model to your inputs.
<input type="text" ng-model="thisInput" class="form-control" id="" placeholder="" required>
See if that fixes it

angularJs check if input is entered

I am new to angular Js and developing a form where the input box will minimize when input is being entered. i am using ng-blur,ng-click and ng-focus and calling the function which will change the css classes for this purpose.
But the issue is when id/password is saved, the css class is not changed as their is no click,focus,blur on the form.
Below is the code snippet
<input class="field" name="id" ng-model="form.id"
ng-click="onClickFunction()" ng-focus="onFocusFunction()"
ng-blur="onBlurFunction(fieldValue)" type="text" required>
How can the id/password that is saved be recognized?
Thanks in advance.

I think you can use something like below assuming loginform as the form name and username as your name for userID field
<input id="login_username" class="form-control" type="text" ng-minlength="5"
name="userName" placeholder="Username" ng-model="userName" required
autofocus>
<div style="color: red" ng-messages="loginForm.userName.$error" ng-if="loginForm.userName.$dirty">
<div ng-message="required">This field is required</div>
<div ng-message="minlength">Username should be over 5 characters</div>
</div>

Angular JS get error to show after user highlights input field and doesnt enter anything

I have some Angular JS validation working on my wizard steps app and errors appear when the user enters a character in the input field and removes it. I am wondering how do I get the error to show after the user is on the input field and does not enter anything? (They tab onto the field and tab off without entering anything) I hope this makes sense....
<td>
<label>Your Name</label>
</td>
<td>
<input class="form-control" type="text" name="name" ng-model="user.name" required />
<span class="error" ng-show="user.validate.step1.name.$invalid && !user.validate.step1.name.$pristine">Required Field
</span>

Use ng-blur:
<td>
<label>Your Name</label>
</td>
<td>
<input class="form-control" type="text" name="name" ng-model="user.name" ng-blur="blur=true" required />
<span class="error" ng-show="user.validate.step1.name.$invalid && blur">Required Field
</span>

The easiest/best way would probably by marking the control as dirty by using ng-blur:
<input class="form-control" type="text" name="name" ng-model="user.name" required ng-blur="user.validate.step1.name.$dirty = true"/>
The next 1.3 beta version(beta 12) will have a $touched you can use to check for it, but none of the current versions have that yet.