I have a form with multiple inputs, but when autofilling, the password manager always enters data in the first input above the password. Can I tell it to enter data in a specific input?
Code example:
<input placeholder="Your email" type="email"/>
<input placeholder="You fb id" type="text" />
<input placeholder="Your password" type="password"/>
Chrome might think that your email and text inputs are the same, so it auto fills both of them. So, we are going to put an irrelevant "type" on one of the inputs.
<input placeholder="Your email" type="email"/>
<input placeholder="You fb id" type="url" />
<input placeholder="Your password" type="password"/>
We set the email type to email, fb id to url, and password type to password.
Finally found a solution!!!! If you add an onChange event to the field that is above the password field and accepts automatic login fill, it will fill data in the field specified in js. Here is code example:
HTML:
<input placeholder="Your email" id="userEmail" type="email" />
<input placeholder="You fb id" id="fbId" type="text" />
<input placeholder="Your password" type="password" />
JS:
const fbId = document.querySelector("#fbId");
fbId.onChange = () => {
document.querySelector("#userEmail").value = fbId.value;
};
Result:
Related
I have some required fields in my html code, but they do not show the place holder until I specify that the field is required. I do not know why...
<input class="text" type="password" name="password" placeholder="Enter new password" required="">
<br>
<input class="text" type="text" name="phone" placeholder="Enter new phone number">
The second input does not show the place holder when I run the code.
I'm unable to submit the form
I've checked my code thoroughly for hours and looked at posts on freecodecamp forums but it seems to me I still cannot submit the form and I can't pinpoint the problem.
<form action="https://www.freecodecamp.org/email-submit" id="form">
<div class="email-box">
<label for="email">Email: </label>
<input type="email" id="email" name="email" placeholder="Enter your email here.." required>
</div>
<div id="submit-box">
<input type="submit" id="submit" name="submit">
</div>
</form>
When I click the #submit element, the email is submitted to a static page (use this mock URL: https://www.freecodecamp.com/email-submit) that confirms the email address was entered (and that it posted successfully)
The error states:
AssertionError: The #email input should have a name attribute : expected false to equal true
So, add name attribute:
<input type="email" placeholder="Enter email address"id="email" name="email" required><br>
For any help check here.
I am looking for an input which has to take only email addresses as the input, however it is allowing any input. I want the input box to be focused as danger until it is a valid email address. It should show an alert message if it is not a proper email address.
<input type="email" class="form-control" placeholder="Email Id"
id="customerRegistrationEmailId" data-toggle="tooltip"
data-placement="top" title="Enter Email Id" />
<input type="email" name="email" required
ng-class = "{'redborder':errortemp||email.shwerr,'greenborder':contactform.email.$valid}"
ng-click = "errortemp = false;email.click=true;"
ng-model="userdata.email" autocomplete="off"
ng-pattern = '/^[A-Za-z0-9._%+-]+#[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$/' >
In the controller:
$scope.errortemp = false;
if(!userdata.email.$invalid){
$scope.temp=True
}
<input type="text" class="form-control " name="username" placeholder="Enter ID " required >
I have to change the position of validation which tells please fill out details to rightside of textbox.I have to change validation message to "Enter Username".How to implement those?
For custom validation messages i got an answer
<input type="text" id="username" required placeholder="Enter Name" oninvalid="this.setCustomValidity('Enter User Name Here')" oninput="setCustomValidity('')" />
I gave like
<td> <label for="email" class="required">To:</label></td>
<td><input type="email" id="email" name="Email" class="k-textbox" placeholder="e.g. myname#example.net" required data-email-msg="Email format is not valid" "/></td>
and in the
document.ready(function(){}
I have defined like
var validator = $("#email").kendoValidator().data("kendoValidator");
It is validating single email, I want to validate more than one email at a time. How can I do this?
You should then add the attribute multiple to the input tag:
<input type="email"
id="email"
name="Email"
class="k-textbox"
placeholder="e.g. myname#example.net"
required
data-email-msg="Email format is not valid"
multiple="multiple"/>
You can now add multiple email adresses separated by a coma.