Home/ Questions/Q 9274931
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-18T16:28:09+00:00

I have a site with a user login form shown in a data-rel=’dialog’ link.

  • 0

I have a site with a user login form shown in a data-rel=’dialog’ link. Problem is thatthe dialog is appearing in the history when you hit the browser back button. Screen grabs here – a) shows initial not logged in state, b) open dialog after clicking on ‘login’ button, c) successful login, d) I’ve hit the back button and get my dialog and e) I’ve closed the dialog with the default ‘x’ button, am brought back to my home page, but in a logged out state.

In the code below, the login button/link (to ‘/php/mobile_login.php’ ) is replaced by one’s name is login cookies are detected server side.

Also, given that I get back to the home page with data-dom-cache disabled, should it not fetch it from the server again?

Many thanks, Kevin

<!DOCTYPE html>

<html lang='en'>
<head>
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'>
<title>title</title>
<meta name='viewport' content='width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;' />


<script src='//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js'></script>
<script src='/js/jquery_mobile_global_defaults.js'></script>
<script src='http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js'></script>
<link rel='stylesheet' href='/design/mobile_style.css'>
<link rel='stylesheet' href='http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css' />
</head>
<body>

<div data-role='page' data-dom-cache='false' id='homepage'>

    <div class='header'>
        <div class='logo'></div>
        <div class='login'><a href='/php/mobile_login.php' data-overlay-theme='b' data-transition='none' data-rel='dialog' data-role='button' data-inline='true' data-icon='arrow-r' data-iconpos='right' data-theme='a' data-mini='false'>Login</a></div>
    </div>


    <div class='mobile_content'>
    content
    </div>

</div>

</body>
</html>

Dialog:

<!DOCTYPE html>

<html lang='en'>
<head>
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'>
<title>title</title>
<link rel='stylesheet' href='/design/mobile_style.css'>
<link rel='stylesheet' href='http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css' />
<script src='//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js'></script>
<script src='/js/jquery_mobile_global_defaults.js'></script>
<script src='http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js'></script>
</head>

<body>

<div data-role='dialog'  id='member_login_div' data-overlay-theme='b'>
        <div data-role='header' data-theme='d'>
            <h1>Login</h1>

        </div>

        <div data-role='content' data-theme='c'>
        Login below to apply for jobs with your stored CV (use the desktop version of the site to upload your CV if you have not already done so).
        <form data-ajax='false'  method='POST' action='/php/mobile_do_login.php'>
        <label for='cjloginemail' class='ui-hidden-accessible'>Email Address</label>
        <input type='text' name='user_email' id='cjloginemail' value='kevin@solomon.ie' placeholder='Email Address'>
        <label for='cjloginpass' class='ui-hidden-accessible'>Password</label>
        <input type='password' name='password' id='cjloginpass' value='' placeholder='Password'>
        <input name='Submit' type='submit' value='Login'>
        </form>
        <p><a href='/php/mobile_forgot_pass.php'>I forgot my password - email it to me.</a>


    </div>

</div>
</body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Maybe you could try closing any dailog onload using $('.ui-dialog').dialog('close').

    REF: JQuery mobile – Dailogs

    I have read this on the same page, it is weird that it is happening to you.

    **

    History & Back button behavior

    **

    Since dialogs are typically used to support actions within a page, the framework does not include dialogs in the hash state history tracking. This means that dialogs will not appear in your browsing history chronology when the Back button is clicked. For example, if you are on a page, click a link to open a dialog, close the dialog, then navigate to another page, if you were to click the browser’s Back button at that point you will navigate back to the first page, not the dialog.

    UPDATE: Dialog appears on back button in FireFox browser. Works fine on IE9 and Chrome.

    • 0