Hey guys,
unusual question: I have a input field #birthday that should accept european date format like this. dd.MM.yyyy
I wonder if it is possible to auto apply dots when typed into this field.
Imagine the inputfield is focused and empty. I start typing to numbers and the field autogenerates a dot, again two numbers and a dot is generated.
My aim is to type only numbers without needing to add the dots.
any idea how i could achieve that with jquery or javascript in general?
$('#birhtday').keypress(function() {
// ?
})
Why not use existing jQuery plugins?
Masked input
meioMask - I find it nicer because it doesn't use those underscores (but it seems to have some bugs when TABing through filled form)
Related
I am creating a ASP.NET web app and I need to mask the input string in a textbox. The string needs to be masked like:
DR117-17
So, two characters(DR), followed by 3 digits, followed by a '-' and followed by the fiscal year(yy).
The user has to actually input only the 3 digits (ex:'117').
The perfect solution would be that the characters 'DR' are automatically inserted on click, then wait for three digits to be input and then automatically add the '-17'.
Using the jQuery mask plugin is pretty straightforward:
$("#date").mask("DR999-17");
Working fiddle: http://jsfiddle.net/55003z11/
I'm facing a problem where I would like to give an user an immediate feedback that an input field already doesn't comply following a validation pattern and not after providing the whole value.
To give you an example:
UK postcode might look like this [SW1W 0NY] and I would like to inform the user that everything looks good so far when he enters [SW] but give him immediate feedback when he enters for example [1].
How would you approach this? Since UK postcode can be up to 7 numbers I don't want to create 7 regular expressions to check the postcode against based on the postcode length but rather have some 'feedforward' machanism.
The final validation could look like this:
/^[a-zA-Z]{1,2}[0-9]{1,2}[a-zA-Z]{0,1} ?[0-9][a-zA-Z]{2}$/
And for the partial validation I would try something like this:
^([a-zA-Z]{1,2}([0-9]{1,2}([a-zA-Z]{0,1}( ?([0-9]([a-zA-Z]{1,2})?)?)?)?)?)?$
all the parts are optional, just make sure, that even in the last part can be one or two chars.
I am trying to do a validation on a textbox value with jquery to make sure textbox accepts only alpha numeric values. I am also trying to allow spaces between words. I am not trying to allow spaces to left and right of the sentence in textbox. how can I allow spaces in middle of words in the textbox?
My trails fiddle
$('#dsTest').keyup(function() {
if (this.value.match(/[^a-zA-Z0-9]/g)) {
this.value = this.value.replace(/[^a-zA-Z0-9]/g, '');
}
});
You're not going to be able to do it gracefully using only keyup, because while still in the process of typing the sentence, the space you just typed (intending it to be in the middle) is at the end.
Instead, I would do something like this:
$('#dsTest').keyup(function() {
if (this.value.match(/[^a-zA-Z0-9 ]/g)) {
this.value = this.value.replace(/[^a-zA-Z0-9 ]/g, '');
}
});
$('#dsTest').focusout(function() {
this.value = this.value.trim();
});
Allow spaces to be typed while typing is in progress, and strip the leading and trailing spaces with String.trim() at some reasonable later point. In my example, I use .focusout(), but you could also just trim when consuming the value.
This is an example of a broader category of validation problems in which testing WHILE input is being entered prevents the user from entering a value that would have been legal once they were done - because entering the value one character at a time requires the value to temporarily have an invalid state. There are two main ways of handling that problem:
Don't test for validation until the user has finished inputting the value
Flag invalid values rather than altering them
You can also combine the two - for instance, highlighting the field while the user is typing to show that the current value is invalid, and then also fixing the value to make it valid if they leave the field while the invalid value is still present.
In pure regex this should work /^[a-zA-Z0-9]+[a-zA-Z0-9\s]*[a-zA-Z0-9]+$/g. Note that this would requires at least 2 characters in the value. If you want to also allow it to be blank then you could do /^([a-zA-Z0-9]+[a-zA-Z0-9\s]*[a-zA-Z0-9]+|)$/.
With all that said, it is prob better usability-wise to just trim the value, as mentioned by other answers, since that does not stop the user from moving forward if they accidentally add a leading or trailing space.
I have an input field named "VERSION" in a form where I have to write the version of the document.
e.g.
Version : 10.1.2.3
How to validation for this input field in javascript?
Can you use a regular expression?
(\d+\.)+.\d+
Meaning: one or more digits, followed by a point, repeated as many times as you want, followed by a point and one or more digits.
If you have to have 4, you can make it more specific:
(\d+\.){3}.\d+
If it has to be 2 digits, one one one, try:
\d\d\.\d\.\d\.\d
As you see, you need to be more clear about "what is a valid version, and what is not" in order to obtain a more specific answer :]
You mean you'd validate if there is a version input in the correct format?
(use an ID for the input field)
if(document.getElementByID('VERSION').value.match(/^\d+\.\d+\.\d+\.\d+$/)) {}
This should match all versions in the format {number}.{number}.{number}.{number}
Maybe you have to trim the string before you do that
I have 3 TextBoxes on the page. How do I setup one validator (and what's kind of validator?) to validate each of TextBoxes on client side?
First textBox must contains only 1-3 number of digits, second - infinite number of digits, third - 0-5 number of digits
It would be better to use different validators for different text boxes.
Use 3 validators for each with display message as * sign.
Then use Validation Summary control to print a single message for all of them, as you want a single message to be displayed for all. Refer this link: MSDN Validation Summary
Check this too: Validation Summary to work with client-side validations
Your expressions would be along the lines of:
[0-9]{1,3}
[0-9]+
[0-9]{0,5}
Updated following further info:
You could combine the values from each text box into a comma separated value and then validate that using [0-9]{0,3},[0-9]+,[0-9]{1,5} expression.
Either use javascript to copy the value into a hidden textbox field with it's own regex validator using above expression, or just perform the validation manually.
e.g. Using jquery
$('#hiddenCombinedField').val($('#field1').val()+','+$('#field2').val()+','+$('#field3').val());
Run this just before you call validate on the form.
See also http://speckyboy.com/2009/12/17/10-useful-jquery-form-validation-techniques-and-tutorials-2/ for some useful reference material.
You could use a CustomValidator but i would prefer using three distinct validators, one for every TextBox.
It's possible to leave the ControlToValidate-property of the CustomValidator empty. On this way you can validate multiple controls at the same time.