Mobile Number Masking using Javascript? - javascript

I want to use masking for Mobile Number in javascript.In this masking, I want to fix (+91) then user can input mobile number(10 digit number)
<label>Phone Number</label>
<input type="button" value="Turn on Mask" id="maskon" />
<input id="phone" type="text" value="" />
$("#maskon").click(function(){
$("#phone").mask("(+91) 9999-999999");
});
If I am using the given masking then I am able to put any digit in place of 9 instead of it I want to have (+91) as fixed.
Is there any idea to solve this problem?
Thanks in Advance!!

I do not think that there is an option for making first few digits fixed for mask plugin.
However you could also write keyup event for textbox and write a regex that verifies that first three digits are +91. You can use this regex for that. /(\+\d{2})/

Related

HTML Field Type Input Number Only or Letter Only Without JavaScript

I create a form, where one field should only be filled with numbers.
I want that field can be filled only with numbers since entering input.
Like this example :
How Can I Use Javascript to Allow Only Numbers to Be Entered in a TextBox?
I've tried using Regex, but when I try to input is still able to enter letters.
<input type="number" min="2" pattern="^[0-9]" class="andi_input required-entry" name="amount" id="amount" required title='Only Number' />
I want it when input to field and not after click the Submit button and the message appear and inform that the field can only be filled with numbers.
I also try to add validate-number, but the result is the same.
How, without javascript, so that the field can only be filled with numbers or letters?
Whether for this kind of case have to use JavaScript or is there another way without JavaScript?
HTML 5 uses the type="number" so make sure that the browser that you are using is compatible. Check it out in action here.
You should check browser compatibility.
You're right with <input type="number" pattern="^[0-9]" />.
Your regex rule is :
^[0-9] :
^ assert position at start of the string
[0-9] match a single character present in the list below
(0-9 a single character in the range between 0 and 9)
You can check your regex here.
I use to use HTML5 Validation and jQuery one because IE is capricious most of the time.
UPDATE :
Without Javascript it's not possible to check pattern on real time. I suggest you to use a jQuery library like : http://www.jqueryscript.net/form/jQuery-Plugin-For-Formatting-User-Input-with-Specified-Pattern-formatter-js.html.
Here is a OneLiner:
<input type="number" onkeypress="return /[0-9]/i.test(event.key)">
or
<input type="text" onkeypress="return /[a-z]/i.test(event.key)">

Show Decimal Keyboard in HTML5 iOS 7 / iOS 8

I just have a simple question after having searched for hours now: Is there any possibility to show the decimal keyboard in webbrowsers input fields? input type="number" only shows numbers but i need a comma or dot instead in the bottom left corner.
I tried anything, pattern, step etc., but nothing brings up the decimal keyboard. I only need the numbers and a dot or comma, no A-Z or a-z or anything else.
<input type="number" id="inputNumbers" pattern="[0-9]*" size="30" min="1" max="5">
This is what i get:
This is what i want:
Checkout inputmode="decimal" starting on iOS 12.2
https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode
https://caniuse.com/#feat=input-inputmode
https://github.com/mrchandoo/cordova-plugin-decimal-keyboard
Lets you configure the decimal character(instead of . you can change to , )
This works for iPhone and Android:
<input type="text" inputmode="decimal">
Results in this keypad with iPhone 10:
And with Android:
Try this:
EditText myEditText = (EditText)findViewById(R.id.myEditText);
myEditText.setInputType(InputType.TYPE_NUMBER_FLAG_DECIMAL);
Or:
<input type="tel" />
This is a bit of a hack:
<input type="number" step="0.01">
Might work depending on what you are trying to achieve when it comes to input values
This link might be useful:
Force iOS numeric keyboard with custom / currency pattern
Hope you come right!
Check this html code according to your pattern
<input type="text" pattern="[a-z]*">

Angular text form with numbers only?

So I have an input form in Angular here:
<input ng-model="sc.zip" class="form-control" maxlength="5" type="text" />
I don't want type="numbers" because the form needs to be a plain empty textbox. However, I only want the user to be able to type numbers. Either I need to detect when the input is not a digit, or be able to search through the box to find non-digits when submitting.
Either way, I need to validate that the form is digits only. Any help would be appreciated!
use regex
<input name="title" type="text" ng-model="sc.zip" ng-pattern="/^[0-9]*$/" required/>

How to force mobile browsers to pull out numeric keyboard for input type="text"?

In my angularjs app, i have two input fields with type="text", pls see the plunkr here.
The problem is that the currency formatting is not possible for input type="number".
So it it possible to bring up Numeric keyborad for mobile devices when the focus move to input type="text"?
Please help
use "tel" I'm sure this will solve your problem. this will allow you to input alphabates also but it will open numeric keypad
<input type="tel">
Add pattern to it.
<input type="text" pattern="\d*">
Try the below. Additionally you can add "ng-pattern" to manage validation messages etc.
<input type="text" pattern="[0-9]*">

Use regex to do validation in g:TextField

I am working on a grails applications and want the ability to do validation on a g:textField. I just want to make sure that numbers are numbers and words are words. I would like to avoid doing it through JS but if that is the only way, then so be it. Here is what I am trying out.
<g:textField type="number" pattern="^(?:[-+]?[1-9]\d*|0)?(?:\.\d+)?\$" class="form-control" name="hours" value="${hours}"/></div>
Any suggestions or directions? Or should I just do it through JS?
So I was able to figure out the correct regex. The issue that I was having was about the escape characters and the way they were being interoperated.
<g:textField type="number" pattern="^[0-9]+\\s*\$|^[0-9]+\\.?[0-9]+\\s*\$" required="true" class="form-control" name="hours" value="${deliverable.estimatedHours}"/>
This will now check the format for an input string and make sure that it only contains numbers.

Categories

Resources