pkdevbox / iui

Automatically exported from code.google.com/p/iui
MIT License
0 stars 0 forks source link

Pressing GO on virtual keyboard submits form the wrong way #76

Open GoogleCodeExporter opened 8 years ago

GoogleCodeExporter commented 8 years ago
What steps will reproduce the problem?
1. Create a form in iui.
2. Enter values into your fields.
3. Press "GO" on you keyboard instead of the Submit button

What is the expected output? What do you see instead?
- I would expect the form to submit the same as when you hit the Submit
button. Hitting "GO" Submits the form outside of iui.js so you have a page
with no CSS.

What version of the product are you using? On what operating system?
iui-0.1.3, Tomcat 6, Mac OS X 10.5.2

Please provide any additional information below.

Original issue reported on code.google.com by MyUncleRico@gmail.com on 26 Mar 2008 at 6:23

GoogleCodeExporter commented 8 years ago
Me again, i am stupid, for some reason i had the attribute Target="_self" in my 
form
element. DONT DO THAT!!! Know everything is happy and wonderful.

Original comment by MyUncleRico@gmail.com on 26 Mar 2008 at 8:44

GoogleCodeExporter commented 8 years ago
I am having the same problem...  I do not _self as a target though, everything 
looks correct on my form.  
However, if you hit the go button on the virtual keyboard, no iui.js

Original comment by shannon....@gmail.com on 9 Apr 2008 at 7:09

GoogleCodeExporter commented 8 years ago
OK, this is probably on me also.  This behavior only occurs when the form is in 
a <ul> tag (which I didn't intend 
for it to be).  Once I pulled it out of the <ul> block it behaves as expected.  
The virtual keyboard does not go 
away on it's own, but I think I saw a workaround for that somewhere...

Original comment by shannon....@gmail.com on 10 Apr 2008 at 10:39

GoogleCodeExporter commented 8 years ago
I'm having the same problem, but my form is not in a ul.  Would definitely 
appreciate a fix.  thanks!

Original comment by cmerc...@gmail.com on 17 Jun 2008 at 3:17

GoogleCodeExporter commented 8 years ago
same here, html looks like this:
 <a class="whiteButton" type="submit" href="#">Send</a>

no ul around it.

Original comment by poo...@gmail.com on 25 Jul 2008 at 7:49

GoogleCodeExporter commented 8 years ago
I'm having de the same problem. My form is not in a ul, is in a div, but I 
think that 
this is not important. When I press 'GO' the form submits whitout capture the 
event 
and no call the submitForm() function. Then, the result page is load without 
styles 
(css).

Is there a temporal solution?

Original comment by sergi...@gmail.com on 15 Dec 2008 at 5:30

GoogleCodeExporter commented 8 years ago
I response myself. There is a temporal solution.

In the input field what I press 'GO' and the form submits, I've added the next 
javascript code:
                onKeyPress="return disableEnterKey(event)"
And then, this function in a js file:

     function disableEnterKey(e){
        var key;
        if(window.event)
            key = window.event.keyCode;
        else
            key = e.which;
        if(key == 13 || key == 10)
            return false;
        else
            return true;
      }

The key valor need to capture is 10, 13 is a normal enter.

It works in my webapp.

Bye. 

Original comment by sergi...@gmail.com on 16 Dec 2008 at 4:30

GoogleCodeExporter commented 8 years ago
the go button is trigering the submit handler, so i hook up to the submit event 
and
make an ajax form submit, i also check that the form has the dialog class so i 
not
mess with another forms. Just add this code to iui.js at around line 179 and 
add the
"dialog" class to the forms that you want to submit via ajax when enter (Go) is 
pressed

    addEventListener("submit", function(event) {
        if (hasClass(findParent(event.target, "form"), "dialog")) {
            submitForm(findParent(event.target, "form"));
            event.preventDefault();
        }

    }, true);

if someone need it i could submit as a patch

Original comment by joki...@gmail.com on 16 Mar 2009 at 6:28

GoogleCodeExporter commented 8 years ago
I have the same issue. I could not get sergi.bc's fix to work properly, it only 
worked within non iPhone browsers, still allowed to submit GO on iphone. Using 
jokin.c's fix did work fine, however when the ajax event happens (ie: scroll 
left to 
the new window content) it left the keyboard visible as well as the cursor from 
the 
previous field.

Is there a way to "hide" or tell the keyboard to go away?

ps: thanks again jokin, thats a great help :)

Original comment by andrewst...@gmail.com on 27 May 2009 at 2:56

GoogleCodeExporter commented 8 years ago
Just to answer my own question, i added the following to the FORM tag which 
appears 
to work.

onSubmit="document.getElementById('fieldID').blur()"

Thanks everyone!

Original comment by andrewst...@gmail.com on 28 May 2009 at 3:27

GoogleCodeExporter commented 8 years ago
I was thinking that the blur function should remove the iphone virtual 
keyboard, but 
I couldn't find a way to get the currently selected element, so I finished 
calling 
the blur function to every input in the encodeForm function that it's called on 
the 
form submit. 

about line 300:

function encodeForm(form) {
        function encode(inputs) {
            for (var i = 0; i < inputs.length; ++i) {
                if (inputs[i].name){
                    args.push(inputs[i].name + "=" + escape(inputs[i].value));
                    inputs[i].blur();
                    }
            }
        }

        var args = [];
        encode(form.getElementsByTagName("input"));
        encode(form.getElementsByTagName("select"));
        return args;
    }

Original comment by joki...@gmail.com on 28 May 2009 at 4:25

GoogleCodeExporter commented 8 years ago
this works for me.

in form HTML:
.....
<input type="text" name="k" id="k" value=""/>
.....

in iui.js:
....
function showForm(form)
{
    form.k.focus();

    form.onsubmit = function(event)
    {
        form.k.blur();
        event.preventDefault();
        submitForm(form);
    };

    form.onclick = function(event)
    {
        if (event.target == form && hasClass(form, "dialog"))
            cancelDialog(form);
    };
}
.......

Original comment by kelvin...@gmail.com on 24 Jun 2009 at 2:14

GoogleCodeExporter commented 8 years ago
Thanks all, I was having the same problem.  Jokin.c's solution in comment 8 
worked, but 
then I had the problem with the keyboard sticking around.  Andrewsteed's 
solution in 
comment 10 took care of that follow-up.  Phew!

Original comment by Chad.Hae...@gmail.com on 31 Jul 2009 at 5:15

GoogleCodeExporter commented 8 years ago
Comment 11 solved it for me. Only I placed it inside submitForm():

function submitForm(form)
{
        var inputs = form.getElementsByTagName('input');
        for (i=0 ; i<inputs.length; i++){
            inputs[i].blur();
        }
    iui.showPageByHref(form.action, encodeForm(form), form.method || "POST");
}

Thanks jokin

Original comment by jcan...@gmail.com on 18 Feb 2010 at 8:26

GoogleCodeExporter commented 8 years ago
sergi.bc, you are a genius. I kept capturing key 13 and it wouldn't work on 
iphone.

Original comment by ser...@gmail.com on 25 Mar 2010 at 3:48