]> git.mxchange.org Git - quix0rs-gnu-social.git/commitdiff
Workaround for bug 1317 '"What's up" textarea on iPhone missing proper submit button'
authorbrion <brion@smidge.(none)>
Mon, 10 Aug 2009 01:39:51 +0000 (18:39 -0700)
committerCraig Andrews <candrews@integralblue.com>
Mon, 10 Aug 2009 15:58:55 +0000 (11:58 -0400)
http://laconi.ca/trac/ticket/1317

Mobile Safari shows a 'return' button for making newlines in a <textarea> where it would show a submit button for plain <input> text fields...
However there's a keydown event handler which is supposed to detect hitting enter and submit the form for us. This didn't work on Mobile Safari because it was checking of 13 ("\r") but the iPhone sends us char 10 ("\n") here. Changed to accept both, so we now submit on hitting 'return' on iPhone.

Note: I also added a blur() to move focus out of the textarea, which closes the on-screen keyboard. It will also take focus out of the textarea on other platforms, but this is probably the right thing -- the same thing happens when you push the "send" button after all.

Also note: unfortunately the layout right now looks pretty awful generally while editing on the iPhone; you can't see the send button or character counter while typing at the default zoom, and it doesn't zoom out after you submit so you can't really see where your message is going. This should be dealt with in general by fixing up the mobile skin variant...

js/util.js

index 440701937ae63cc2645e38ad56db2b1e96d8cc53..e5f117df0feb40b7ae98b2c91763698551741ba6 100644 (file)
@@ -55,10 +55,13 @@ $(document).ready(function(){
        }
 
        function submitonreturn(event) {
-               if (event.keyCode == 13) {
+               if (event.keyCode == 13 || event.keyCode == 10) {
+                       // iPhone sends \n not \r for 'return'
                        $("#form_notice").submit();
                        event.preventDefault();
                        event.stopPropagation();
+                       $("#notice_data-text").blur();
+                       $("body").focus();
                        return false;
                }
                return true;