I am using jQuery validationEngine.js plugin for validating input fields. It requires me to add a class="validate[required] text-input" so it can validate when submit the form. But I have class="form-control" and, due to this, the validation is not working. If I remove class="form-control" validation will work but input box will be misaligned. Is there any way I can keep both? Or any other solution for this problem ? Thanks!
<input
name="selectAgent"
type="text"
class="form-control"
id="selectAgent"
class="validate[required] text-input"
>
Add all your classes at once. Having two class declarations can cause an error.
Use (notice how form-control is added to the end of your class with a space that is how you can add another class)
<input
name="selectAgent"
type="text"
id="selectAgent"
class="validate[required] text-input form-control"
>
Instead of
<input
name="selectAgent"
type="text"
class="form-control"
id="selectAgent"
class="validate[required] text-input"
>
Related
<input type="text" class="form-control" id="datepickerFrom" placeholder=" " name="From" onchange= "errorCheck()" required>
Need to disable tooltip as shown in attached image (using jquery and bootstrap in my code. tried many ways but not disabling.
Prevent autocomplete of any field (might not work):
<input type="text" class="form-control" id="datepickerFrom" placeholder="" name="From" onchange="errorCheck()" autocomplete="nope" required />
Explanation:
autocomplete still works on an despite having
autocomplete="off", but you can change off to a random string, like
nope.
Here you can set readonly attribute to input because you are using datepicker so no need to give input via keyboard.
<input type="text" class="form-control" id="datepickerFrom" placeholder="" name="From" onchange="errorCheck()" readonly required />
Add autocomplete="off" to your input
I want to restrict my Comments text box within 40 characters. I have used max=40.Its not working. Anyone please help me to fix this issue
Code:
<label for="cmds">Comments</label>
<input type="text" max="40" class="form-control" id="cmds" name="cmds"
data-ng-model="Audit.cmds" placeholder="null" >
Since you are dealing with comments, its better to use textarea instead of input type="text".
By using textarea you can do:
<textarea maxlength="40" id="comments" cols="" rows="">
Demo: https://jsfiddle.net/akshaymhatre89/L8fky10q/4/
<label for="cmds">Comments</label>
<input type="text" ̶m̶a̶x̶=̶"̶4̶0̶"̶ class="form-control" id="cmds" name="cmds"
data-ng-model="Audit.cmds" placeholder="null"
ng-maxlength="40" />
For more information, see AngularJS ng-maxlength Directive API Reference.
I am trying to use multiple patterns for an input-field in HTML5.
<input type="text" pattern="\d*.{5,10}" name="plz">
My current input field does not work. Only the second pattern .{5,10} is relevant for the submit. The first attribute \d* hast no effects.
Try the below:
<input type="text" placeholder="" class="form-control" pattern="([0-9]{2})([0-9]{2})([0-9]{2})([0-9]{4})([0-9]{1})">
and just accept AESE640526HOCCNL05...
Hope this can help you.
In most HTML forms when I start typing something (say birth date) navigators propose to sit with previous similar entries. For instance on html form submit the second visit offers me the first visit entries.
However, when using a bootstrap modal containing a form, the same does not happen, for instance: with a form inside.
I do not want to use jquery autocomplete since I do not have a list of potential answers, I just want to have the same behavior in and outside modals.
Thanks.
Browser autofills are notoriously unpredictable - they make educated guesses about the data based on the name attribute of inputs. It's unlikely you'll be able to get this behavior consistently cross-browser.
can you try this :
add the attribute autocomplete = "on" on your form,
maybe it will do the job.
<form action="demo_form.asp" autocomplete="on">
First name:<input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
E-mail: <input type="email" name="email" autocomplete="off"><br>
<input type="submit">
</form>
source: http://www.w3schools.com/tags/att_input_autocomplete.asp
Read through this article it should help get things working for you.
Example:
<input type="text" id="name" name="name" autocomplete="name">
<input type="tel" id="tel" name="tel" autocomplete="home tel">
Why is it that the s:textfield is placed on bottom when I insert it in between other HTML elements inside a form?
How can I fix this?
<label><span class="required">*</span>First name</label>
<input type="text" id="firstName" name="firstName" value=""><br>
<div>
<s:select id="selectDrop" list="list" name="list"/>
</div>
<label><span class="required">*</span>Last name</label>
<input type="text" id="lastName" name="lastName"><br>
Result on browser:
First Name
Last Name
"The drop down element"
Ok I actually was able to solve by adding the them="simple" in the s:form element.
<s:form id="registrationForm" action="/registration/.action" method="post" theme="simple">
I guess if I don't add them property Struts2 UI components add their own stylesheet and therefore get weir behavior.