Entering multi language text in a html page - html

How can we enter another language other English in a text box in a html page
For example i have text box where we enter name and we provide different buttons
<html>
<body>
<form>
NAME:<input type="text" name="name"/>
<button>English</button>
<button>Latin</button>
</form>
</body>
</html>
Now based on the button clicked the text entering mode should be changed
How can i get this

There is a way out for this by changing browser settings... You can set your browser language and can accept required input language from keyboard... however this will be too limited... you can accept only those which browser... and this implementation will be browser specific...
Please refer this link for further information.
i do not think there is way for this in the programming... either in java script (or) in HTML

Related

Use HTML5 to check inputs in quiz style format

I am trying to use HTML5 to offer some sort of live quiz on a webpage. I am not interested in submitting or storing the user inputs on a server, I just want to show the user a direct feedback on whether his inputs are correct or not. I want to use pure HTML5 and a purely client based evaluation, without any javascript or server evaluation.
Unfortunately, I am no HTML expert at all. The HTML5 code I have come up with so far is the following:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Exercise</title>
<style>
/*An incorrect input:*/
input:invalid{
color:red;
}
/*A correct input:*/
input:valid{
color:green;
}
*/
</style>
</head>
<body>
<p>
Complete the missing words using information from the following template:
<ol>
<li> This is a first test.
<li> This is a second test.
</ol>
<p>
<form action="#.ext" method="post" id="myform">
<ol>
<li>
<label for="GM">This</label>
<input required
type="text"
id="GM" name="GM"
pattern="is">
<label for="GM1"> a </label>
<input required
type="text"
id="GM1" name="GM1"
pattern="first">
<label for="GM2"> test.</label>
<li>
<label for="GM3">This is a </label>
<input required
type="text"
id="GM3" name="GM3"
pattern="second">
<label> test.</label>
</ol>
</form>
<button form="myform" type="submit">Check and show correct solutions.</button>
</body>
</html>
The HTML5 is already capable of checking inputs against a pattern which contains the correct solution and the change the color of the input element from red to green if the solution is correct.
What I have not managed to achieve so far:
I'd like the checks for all inputs to start only when the button is pressed (but without submitting the inputs to the server, I want to check locally against the patterns.)
I'd like to see correct solutions in all input fields as soon as the button is clicked, even if they have been empty before (however I cannot use the placeholders for that because they would be visible from the beginning)
I'd like to change to colors of the forms only after the button is clicked (e.g. red if solution was wrong and green if it was OK)
In the best case I'd like to additionally add the wrong user input in red and crossed out plus the correct input in green in one input field.
I am fully aware that I am not using those tools the way they are usually intended to be used, since I am not interested in actualy submitting the content of the input fields to the server.
Thanks for any feedback.

Input website into text field, click GO and person is taken to the website from my website

I need a simple html code so that a visitor to my website can type in a textfield what website they would like to visit next and click GO and they are taken there.
I can't seem to find how to do this anywhere. Can't even find any websites that have a similar code.
Here is a quick implementation that will set it based on the text field value. I would suggest putting in validation and much more.
function goToUrl(form){
window.location = form.url.value
}
<form onsubmit="goToUrl(this)">
<input type="text" id="url" />
<button type="submit">Go to URL</button>
</form>

Chrome not prefilling form

I have a form that I would like to have chrome autofill or prefill (I'm using Mac Chrome 26.0.1410.65 on Mountain Lion). The purpose of this is to demonstrate the autocomplete standards: I'd like to show either the fields prefilled on load, or if the user starts typing their first name it will auto-fill both names.
I'm using autocomplete and the entire page is below, with just two fields.
I submit, then the next time I visit the page, I have to start typing into each field to get the drop-down for auto-complete. No matter what I do on the first field, I have to tab to the second and start typing there.
I'd like it to fill in all the fields (well, both) when I accept a value in the first field. How do I get that? I see it happening in commercial websites, where starting to type in a single field and it pre-fills many other fields. (even if there is a yellow background)
<!DOCTYPE html>
<html>
<head><title>Autofill test</title></head>
<body>
<form name="nameform" action="?go" method="POST">
<input type="text" name="givenname" autocomplete="given-name">
<input type="text" name="familyname" autocomplete="family-name">
<button type="submit">Save values</button>
</form>
</body>
</html>
I've seen the other questions that indicate I have to use POST, and there cannot be hyphens in the name. I have also tried x-autocompletetype and autocomplete. I've also tried without the DOCTYPE (I'm getting desperate), and renaming the fields "fname" or "firstname" etc. Nothing appears to work.
Is there something I'm missing?

html page with one input "text". where does the focus go?

because I am having some problems about when using onblur/onkeydown (for tabs) etcetera.
I 'd like to ask this question:
if I have a page with just one input text and I go there and I click the "tab" where is the focus going ? I'd like to know because I'd like to force the input text not to lose focus...
My page is like this:
<!docType>
<html>
<body>
<div><input type='text' /></div>
</body>
</html>
If you want to focus specifically that text field than use autofocus attribute
<input type="text" autofocus />
Or if you want to map the tabs in a custom way use tabindex attribute
Tab 2<br />
Tab 1<br />
Tab 3
When there is 1 input text field and there's nothing after that, not even a link than probably the focus will go to the address bar of the browser, or probably it will move to add on bar if the user is having any browser add on, on the add-on bar
In Chrome when you tab away from an input and there are no other elements with tab index on the page the focus changes to the browser's URL bar. There probably won't be anything you can do to prevent this happening.
When you tab again it will return to that element - again provided it's the only element on the page with a tab index.
When you then click back onto the page (not the input) the focus isn't naturally restored to the input field (again, testing in Chrome here), so you may need to use JavaScript to force the focus upon the element.

HTML: What determines the 'move the focus to the next control when Enter is hit' behavior

A basic HTML question. Is it possible on an HTML page to declaratively achieve a behavior when pressing Enter in a textbox moves the focus to the next control? How do you achieve it and how do you turn it off? Or maybe the dynamic javascript part should be involved here?
For exaple, the following HTML in IE7 does not allow to move to the focus to the next textbox with enter:
<html>
<body>
<form>
<table>
<tr><td>
<input type="text" name="i1"/>
<td></tr>
<tr><td>
<input type="text" name="i2"/>
<td></tr>
</table>
</form>
</body>
</html>
I have a page where I need to get rid of this 'move the focus to the next control when Enter is pressed' behavior.
#Edit: The example above turns out to be incorrect. The control the focus jumps to when I press enter on the page I want to avoid this behavior on is actually of type submit. The strange thing is that this "submit" is a part of a Telerik tree control and is not a submit button but an arrow used to collapse and expand the tree structure.
So I assume the focus jumps to the next submit control which the Browser expects to be a normal submit button which is not true in my case.
So I suppose I should look for a Telerik pecific solution here.
In most browsers, pressing Enter when focused within a form will submit the form. If you need to change this behavior so that pressing Enter moves to the next textbox you will need to use javascript.
Try this: (courtesy of javascript.internet.com)
http://javascript.internet.com/forms/tab-key-emulation.html
<input type="text" name="i1" Tabindex="[order number]"/>
I usually lookup these things on:
http://start.gotapi.com/