Take control of the hardware back button using jQuery Mobile

Question

I have gone through the following link and my situation is same like it.

Disable the hardware back function with jQuery Mobile

Situation: Device under test: Samsung Galaxy S III

Page A: ListView with Names(A1, A2, A3)
Page B: Consist of a Form, Submit and Cancel button.

The user fills in the form and click on the Submit button. And his/her data gets uploaded to the server. The page is updated and a confirmation dialog is displayed that data is uploaded to the server.

Now the issue arrives.

Now when the user clicks on the hardware back button he/she is again redirected to Page B and he/she is again able to submit the form (which we don't require, as the form is meant to be filled only once).

So is there a way through which I can control the hardware back button to show Page A whenever it is on Page B?

The following answer from Nirmal seems to have answer, but I don't know how to implement it -

There is no real way disable the hardware back button on the BlackBerry or Android.

What you can do is maintain a session variable which gets invalidated in your back handler and check for that session variable in the pagebeforeshow event of the Exam page.

How can I fix this?

Answer 1

You should be able to capture the hardware back button click event with JavaScript:

$(document).bind('keydown', function(event) {
  if (event.keyCode == 27) {
    // Prevent default (disable the back button behavior)
    event.preventDefault();

    // Your code to show another page or whatever...
  }
});