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.
Related
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:
HTML form
I am trying to combine:
<input name="domain" id="domain" required="" type="hidden" value="domain.com">
<input name="username" id="username" required="" type="text">
to pass this combined information in the form as what is now:
<input name="user" id="user" required="" type="text">
Current code:
<input name="user" id="user" required="" type="text">
This requires the user to type both the domain and user name into the text box.
Example: domain.com\username
I would like to include the static domain “domain.com\” as hidden text to the input so they can just type the username.
Example: username
The code currently is:
<p>Username:</p>
<input name="user" id="user" required="" type="text">
<form class="form-asd" role="form">
<h2 class="form-signin-heading">login</h2><hr />
<label class="control-label" for="username">Username</label>
<input class="form-control" type="email" required="" placeholder="username"data-error="enter username"></input>
<label class="control-label" for="username">password</label>
<input class="form-control" type="password" required=" " placeholder="Password"></input>
<label class="checkbox"></label>
<button class="btn btn-lg btn-primary " type="submit">submit</button>
</form>
how can we change this default message of popover of the require field "Please fill out this field "to "please enter username"
You can use setCustomValidity function when oninvalid event occurs.
Like below:-
<input class="form-control" type="email" required=""
placeholder="username" oninvalid="this.setCustomValidity('Please Enter valid email')">
</input>
Update:-
To clear the message once you start entering use oninput="setCustomValidity('') attribute to clear the message.
<input class="form-control" type="email" required="" placeholder="username"
oninvalid="this.setCustomValidity('Please Enter valid email')"
oninput="setCustomValidity('')"></input>
Combination of Mritunjay and Bartu's answers are full answer to this question. I copying the full example.
<input class="form-control" type="email" required="" placeholder="username"
oninvalid="this.setCustomValidity('Please Enter valid email')"
oninput="setCustomValidity('')"></input>
Here,
this.setCustomValidity('Please Enter valid email')" - Display the custom message on invalidated of the field
oninput="setCustomValidity('')" - Remove the invalidate message on validated filed.
And for all input and select:
$("input[required], select[required]").attr("oninvalid", "this.setCustomValidity('Required!')");
$("input[required], select[required]").attr("oninput", "setCustomValidity('')");
I wanted to change the text of the textarea. This method helped
<form action="/action_page.php" method="post">
<input type="text" required placeholder="username" oninvalid="this.setCustomValidity('Error validate')" oninput="setCustomValidity('')">
<br><br>
<textarea placeholder="Ko’cha, uy, xonadon" name="address" required oninvalid="this.setCustomValidity('Majburiy maydon')" oninput="setCustomValidity('')"></textarea>
<input type="submit" value="Submit">
</form>
$("input[required]").attr("oninvalid", "this.setCustomValidity('Say Somthing!')");
this work if you move to previous or next field by mouse, but by enter key, this is not work !!!
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.
I am using Dreamweaver to make a HTML page. I have a textbox for the user to type into. When I change the following:
<input type="text" id="email" name="email" size="40px" /> when I view it in Firefox, the box size changes, but in IE it says at the default size by the look of it.
Why is IE being such a pain...
Do this instead:
<input type="text" id="email" name="email" style="width:40px" />
Wrong:
<input type="text" id="email" name="email" size="40px" />
Right:
<input type="text" id="email" name="email" size="40" />
The 'size' attribute for input type 'text' and 'password' refers to the (integer) number of characters. Ref: W3C HTML Forms Spec