JavaScript numbers only script (without blocking keyboard shortcuts) - javascript

I have a script in a web application of mine which forces users to type only numbers into certain text fields. However, when the appropriate text field is selected, the script blocks ANY keyboard input other than number keys and tab. I don't want to limit the user from being able to use their browser's or my app's keyboard shortcuts just because they are typing in a numerical field. (Also, I'd rather not just validate the field instead of preventing number input, my app updates the page based on the numerical input live, so it wouldn't be as nice.)
Can someone please help write/find a little script for me? A simple variation of these numbers-only scripts that can be overrided when a modifier key is pressed is enough (and I guess the overrided character would have to be deleted, too).

I'm not going to write a script for you, but I'll give you some pseudo-pseudo-code:
input = input.replace(/\D/, '');

Try YAV, Javascript validator library.
I think you need mask feature.
Look at field Custom: from this example
http://yav.sourceforge.net/en/example_7.html

Related

Is is possible to have text placeholders inside a form field (as to prompt the end user to insert a specific format) without the use of javascript?

So basically, the website is javascript free. No javascript at all. Will not be adding javascript.
However, we need to prompt the end user to enter information accordingly to be used in a database that will then connect to software on the network.
As in, there are 2 hyphens preinserted into a form field for a telephone number. This will prompt the user to enter 310-555-5555 instead of 3105555555.
*** I am a translator for a website owner and a web developer. I am not a programmer. I need a simple answer. I dont need you to explain how to do it. I just need to find out if the programmer is capable or if the website owner is asking for something impossible.
Yeah, it is absolutely possible. There are HTML placeholder attributes available which will do your job.
For modern browsers the HTML attribute placeholder already exists and does exactly what you mentioned.
http://caniuse.com/#feat=input-placeholder Browser support is pretty strong nowadays
Side notes that may not be needed after you further clarified you wouldn't be doing the work:
With that said it gets a little bit more involved if you want to have all users get that information and see it (this is in regards to accessibility). Also placeholders disappear after a user starts typing. Not sure if that is an issue.
Having the explanation part of the label as well (styled differently) will make it always visible and readable by different user interaction.
You can use placeholder attribute to prompt the user to insert a specific format and pattern attribute to validate the pattern entered.
<form>
<input type="text" pattern="\d{3}[- ]?\d{3}[- ]?\d{4}" placeholder="XXX-XXX-XXXX">
<input type="submit">
</form>

How to enable typing for non-english characters in a HTML textarea?

I have installed Arabic web fonts on my website. But when I type anything in a Textarea I see English characters. When I Copy Arabic characters from another website and paste into textarea, they appear perfectly.
How can I insert arabic character directly from my keyboard?
Thanks,
Zubair
you need to change the Keyboard language. Depending on the operating system you must find how to set your keyboard input from standard US to Arabic. On Windows 8 you go to
Control Panel -> Change input methods -> Add a language on Windows 7 and Vista check out the following How to change your keyboard layout. Also I am assuming you have included
<meta charset="UTF-8"> in your HTML file.
To enter Arabic characters on your keyboard, you need to use a keyboard layout (keyboard driver) that allows such typing or to use some other (system-dependent) input method.
But as you probably mean how to make it possible to your visitors to enter Arabic text, that answer is not that useful.
Generally, you can expect that people who can and wish to type Arabic text are using devices and software that make it possible to them to do so. You do not need to do anything except 1) the usual thing of using UTF-8 encoding for the page and declaring it (or, if that is not possible, at least using accept-charset=utf-8 for the form element) and 2) the special thing of setting dir=rtl on the textarea element if it is expected to contain (dominantly) text in Arabic letters or another right-to-left writing system.
However, it is possible that a user who can and wishes to write in Arabic letters is using a non-Arabic keyboard layout, e.g. a US keyboard at a hotel. He might even have no way of changing keyboard layout. You may therefore consider using one of the following techniques (not mutually exclusive, but using both might be confusing):
1) Set up a virtual keyboard on your page, i.e. a set of elements that look like keyboard keys and act so that when you click on one of them, the character shown in it gets appended to the textarea. This is relatively straighforward and does not take much time to code for a relatively small alphabet like the basic Arabic letters. Many sites use such techniques.
2) Set up handlers for keyboard events so that e.g. when a user presses a key that normally produces the letter “a”, your code intercepts it and inserts, say, the Arabic letter ʾalif instead. This is somewhat more complicated due to differences between browsers in handling keyboard events. The main problem, however, is that you cannot know the type of the keyboard used. The user might have a keyboard layout that lacks all Latin letters at least in the primary positions. Moreover, the user might want to type a word in Latin letters, e.g. a proper name in the midst of Arabic text.

Constantly refresh Javascript values of text fields

I'm working on an input form, and I have a Javascript function that gets all of the field values when you press a button. I am looking for a way to automatically refresh the Javascript values (so I can, for example, check if a username is too short on a registration page as they type, and also check if the username is available). Would this be possible?
To clarify, I have an HTML input field (for text), and as the user is typing a result, automatically update.
I'm also open to using PHP or jQuery if it's not possible using solely Javascript, but I'd prefer Javascript if it's possible. Also, sorry if this is a rather basic question, but I've searched and searched and can't find anything on it. I know it's possible because I've seen it on websites (in fact, even on this one, as you type a question, it updates the preview at the bottom).
You should use JQuery Validation Plugin to reduce the heavy checking.
Check this one out at http://jquery.bassistance.de/validate/demo/
No jQuery needed
<input type="text" onKeyUp="validate(this.value);">
function validate(value){
//validate code on value
}
You should monitor onkeyup event
<input type="text" id="test">
$('#test').on('keyup', function() { //this function is triggered every time the user releases a key while typing inside the text field above
//do whatever you want here
});

Password masking as in mobiles using js

Can any one suggest to build a password field that behaves the way passwords are entered using iphone?
When I enter some character, it should be visible to the user for a second and then it should turn to *. But I need to get the value from the field when I submit the form.
Its an ExtJs text field. Is there any plugins available for this? Any help on this will be helpful.
Probably, this can help you:
http://blog.decaf.de/2009/07/iphone-like-password-fields-using-jquery/
Check out this Fiddle
Change textfield to stars like iPhone
Note: this solution is NOT complete and NOT optimal, for example you will have to handle Delete and Backspace buttons manually. You might find some plugin to do it in other way, but this is the simplest way to do it JavaScript I guess.

Simple & basic form spam reduction: checking for Javascript?

I'm trying to reduce the form spam on our website. (It's actually pretty recent).
I seem to remember reading somewhere that the spammers aren't executing the Javascript on the site.
Is that true?
And if so, then could you simply check for javascript being disabled and then figure it's likely that it's spam?
There are still a large number of people that run with Javascript turned off.
Alternatively, I have had decent success with stopping form spam using CSS. Basically, include an input field and label that is hidden using CSS (display: none;) and once submitted, check if anything has been entered in the field.
I generally label the field as a spam filter with an instruction to not put anything in the field, but all newer browsers will properly hide the block.
More: Fighting Spam with CSS
reCAPTCHA is also surprisingly easy to implement.
check http://kahi.cz/wordpress/ravens-antispam-plugin/ for a nice answer
if puts in
<noscript><p><label for="websiteurl99f">Please type "e73053": </label><input type="text" name="websiteurl99f" id="websiteurl99f" /></p></noscript>
<script type="text/javascript">/* <![CDATA[ */ document.write('<div><input type="hidden" name="websiteurl99f" value="e' + '73053" \/><\/div>'); /* ]]> */</script>
so javascript users see nothing, non js users just type in a word
if a spammer targets you specifically it won't take them long to code round it but for drive by spammers it should be good
In the same vein, adding a dummy field and then using CSS to hide it is a good way to trick the bots. If the field is submitted, you know a non-human probably completed the form.
Especially effective if you label/name the field something along the lines of URL or website.
You could check - have JavaScript that populates a hidden form field with a specific value after the page loads. Then, when the page posts back to the server, check that hidden form field the expected value. If it is not there, that means the JavaScript didn't execute.
As to whether you should assume it is spam is another story altogether, and one that has no certain answer, really. You could simply have a <noscript> tag and have it indicate to the user that their submission will not take unless they enable JavaScript.
Once you have JavaScript running, however, the spammers will just use another workaround for that. :)
I can't remember where I've seen this method but spam bots like to fill out forms. Have you considered putting a form field that is hidden with javascript (and says don't fill this field if the user doesn't have JavaScript). This way if something fills in this field you can ignore it as spam.
Did you have any luck with this? I think some text based browsers have implemented basic JavaScript support, so maybe spam bots have as well?
Otherwise I'm considering using a captcha for users without JavaScript and some automatic JavaScript check for other users.

Categories

Resources