0

I have almost completed an ASP.NET webforms website using jQuery Mobile. I am stuck on one specific use case.

The site is scoped to support Android, iPhone, BlackBerry and Windows Mobile all of the functionality works great except for one specific use case.

The case is when a user is entering a value into one of the input boxes and then hits the native Go/Enter key. I am capturing this and throwing the appropriate event submit button click/tap with jquery.

function BindSubmit(textbox, button) {
    $(textbox).unbind().keypress(function (event) {
        var keyCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode;
        if (keyCode == 13) {
            $(button).trigger('tap');
        }
    });
}

This works great on all devices but one, Android. The phone ends up submitting the entire form instead of following the use case. Grabbing the onsubmit event and returning false doesn't work either. After some digging I found this Disabling 'go' button form submission in Android when using webview .

I am hoping for a solution to this for a standard webform. Thanks.

Community
  • 1
  • 1
Brandon Meyer
  • 349
  • 2
  • 14
  • Have you tried triggering `$(button).trigger('click')` instead of 'tap'? Do you have an Android device to test with? Is your code being executed? – Naftuli Kay Dec 13 '11 at 18:47

2 Answers2

1

Thank you for the help. The way we solved this is binding to the form.submit event and calling the mobile.changePage() ourselves. Then after the changePage() we return false; This prevented the full form submit and still allowed jquery mobile to complete its actions.

Brandon Meyer
  • 349
  • 2
  • 14
  • Does that allow for the keyboard to be dismissed? – owencm Feb 07 '14 at 23:33
  • Sorry I don't have that code anymore. Regarding the keyboard dismissed, I would think it would go away from tapping the Go button, as long as you didn't put focus back into an input. – Brandon Meyer Feb 08 '14 at 15:18
0

Try running $(button).trigger('click'). This might be a better, more cross-platform way of sending the event.

You should definitely try to test it like this on an Android phone and find out when and where execution fails:

function BindSubmit(textbox, button) {
    console.log("BindSubmit()");
    $(textbox).unbind().keypress(function(event) {
        var keyCode = ...;
        console.log("Key pressed: " + keyCode + ", isEnter: " + keyCode == 13);
        if (keyCode == 13) {
            console.log("Enter key hit, triggering event.");
            ...;
        }
    });
}

If you have a link to it, I'd be happy to test it on my Nexus One for you :)

Naftuli Kay
  • 87,710
  • 93
  • 269
  • 411
  • Capturing the event isn't really the problem. It is jquery mobile to complete its actions and load the a href without submitting the form, which goes back to Default.aspx. I am going to see if I can set of a jsfiddle to test with – Brandon Meyer Dec 13 '11 at 20:18
  • Excellent, yeah, I'd be happy to help. – Naftuli Kay Dec 13 '11 at 20:45