Solved

Disable form auto submit on iOS device on GO button press, but hide keyboard

Posted on 2015-02-19
1
322 Views
Last Modified: 2015-09-24
Hello,

I am having a bit of an issue with getting a form not to auto submit on iOS devices (which I have solved using the following).

function disableEnterKey(e)
{
	var key;
	if(window.event)
		key = window.event.keyCode; //IE
		else
			key = e.which; //firefox

			return (key != 13);
			
		}

Open in new window


However I also need it to then hide the on-screen keyboard which is where I am a bit stuck.

The elements of the HTML of the form are as follows:

<form role="form" method="POST" name="level1buttons" id="level1buttons">
....
<input id="notes" name="notes"  type="text" class="form-control" onKeyPress="return disableEnterKey(event)" placeholder="Other comments">
....
<button type="button" class="btn btn-black" value="Exit" onClick="autoSubmit();">Save &amp; Finish</button>

Open in new window


The input field NOTES being what causes the form to submit, presumably by running autoSubmit() which is as follows:

function autoSubmit()
{
    var formObject = document.forms['level1buttons'];
    formObject.submit();
}

Open in new window


Is there a better way to do what I am achieving? My knowledge of JavaScript is rather limited.

Thanks,

Lee
0
Comment
Question by:Lee Redhead
1 Comment
 
LVL 34

Accepted Solution

by:
Slick812 earned 500 total points
ID: 40623275
greetings Lee Redhead, , ,  I do not know, or have ever heard of any javascript that can get the Operating system to change its operations, you say -  "However I also need it to then hide the on-screen keyboard which is where I am a bit stuck.", Since there are no OS changes, so then you can try and fool it into taking away the screen keyboard by dropping the Input focus (active input) with the javascript command   blur()   as in -
      document.activeElement.blur();


also you have gone to the trouble of blocking the carriage return key (number 13) in a text input, however, I have had much better results for form Submit Control by using the <form> onsubmit( )  event like -
    <form action="getpost.asp" onsubmit="return verifies(event);">

this onsubmit( )  is run for ALL of the ways a form can be submitted from the page, and Also you can use the  event  object to see which form Input had the focus then the event fired, you can verify that all inputs have an an entry, and block the submission for any reason you program into it, and you do not have to block the carriage return key in any input, if the button is touched, or any of 10 inputs press the carriage return key, then the   verifies( ) function runs. you can get the element that does the submit with   event.target   and if it is NOT a permitted submit element (by your standards) then block the submission.
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Pass form variable from one web form to another 2 29
jQuery Dialog Autoresize Bug 2 25
JQuery Syntax... 4 37
..ignore the Question 1 8
This is a PowerShell web interface I use to manage some task as a network administrator. Clicking an action button on the left frame will display a form in the middle frame to input some data in textboxes, process this data in PowerShell and display…
Is your Office 365 signature not working the way you want it to? Are signature updates taking up too much of your time? Let's run through the most common problems that an IT administrator can encounter when dealing with Office 365 email signatures.
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

828 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question