SitePoint Sponsor

User Tag List

Results 1 to 12 of 12
  1. #1
    SitePoint Guru
    Join Date
    Jan 2007
    Posts
    967
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    HTML 5 form completion checker

    What is the feature called that triggers a confirm box when you leave a page before saving?

    This is the message in FireFox:
    "This page is asking you to confirm that you want to leave - data you have entered may not be saved."

    I wrote a script that submitted with jQuery and it kept triggering the confirm window when posting the data.

    After lots of research, I discovered it was an HTML5 feature.

    E

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,167
    Mentioned
    453 Post(s)
    Tagged
    8 Thread(s)
    Off Topic:

    In my world, it's called a PITA.


    I would suspect this is a JS thing. I've not heard of it being possible with HTML alone.

    Perhaps what you heard about was a feature of one of the new browser APIs (which are wrongly called "HTML5" for marketing/buzz purposes). Still, that they require JS, and they aren't all that well supported yet, so it's safer to use normal JS if it's an important feature.

  3. #3
    SitePoint Guru
    Join Date
    Jan 2007
    Posts
    967
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    The issue occurred as a bug while I was writing a WordPress plugin. The message popped up when the form was submitted.

    I did a side by side comparison of the page HTML before and after text was changed, and it was identical. There were no variables stored, at least not on the page. I realized it was browser related after discovering the message was different in Chrome and Firefox. I could find no documentation in the WordPress Codex, forums, or Google searches on how this works. Perhaps JavaScript communicates with the browser for information about the page.

    E

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,167
    Mentioned
    453 Post(s)
    Tagged
    8 Thread(s)
    It sounds like a standard browser alert (which differs in appearance from browser to browser). It's triggered by JS, and means there's an alert somewhere in the script on the page.

  5. #5
    SitePoint Guru
    Join Date
    Jan 2007
    Posts
    967
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    With alerts and confirms, the text is specified in the Javascript. In this case the text was different in different browsers which would indicate that the browser is generating the text. It may be triggered somewhere on the page. Unfortunately, there is tons of nested Javascript in the WordPress admin, and I couldn't find it. The specific text also couldn't be found anywhere in the WordPress package by my text editor.

  6. #6
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,167
    Mentioned
    453 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by eruna View Post
    With alerts and confirms, the text is specified in the Javascript. In this case the text was different in different browsers ...
    Each browser has its own alert text, though. If you run some code like this in various browsers, you'll get a opup message if you refresh the page, but the message is different in each browser, because each has its default message:

    Code:
    <!DOCTYPE html>
    <html>
        <head>
            <script>
                var myEvent = window.attachEvent || window.addEventListener;
                var chkevent = window.attachEvent ? 'onbeforeunload' : 'beforeunload'; /// make IE7, IE8 compitable
     
                myEvent(chkevent, function(e) { // For >=IE7, Chrome, Firefox
                    var confirmationMessage = ' ';  // a space
                    (e || window.event).returnValue = confirmationMessage;
                    return confirmationMessage;
                });
            </script>
        </head>
        <body>
    test
        </body>
    </html>

  7. #7
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,147
    Mentioned
    190 Post(s)
    Tagged
    2 Thread(s)
    I get similar when I log out here. And also if I start a reply and decide to not post it. eg.
    Firefox
    confirm-leave-firefox.png
    Chrome
    confirm-lieave-chrome.png
    The SitePoint forums are currently not HTML5
    HTML Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en" id="vbulletin_html">
    so my guess is the confirm message box is in some javascript somewhere and not a feature of the mark-up
    Though admittedly it does seem odd the text would vary. I wouldn't bother writing different based on what the browser was.

  8. #8
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,807
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    It is a JavaScript old style debugging call that someone forgot to remove from their script before placing it on their site.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  9. #9
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,167
    Mentioned
    453 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by felgall View Post
    someone forgot to remove from their script
    Alerts certainly are an old fashioned debugging tool, but surely this alert is not for debugging.

  10. #10
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,807
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by ralph.m View Post
    Alerts certainly are an old fashioned debugging tool, but surely this alert is not for debugging.
    Alerts for non debugging use are even more obsolete than ones for debugging since .some browsers display extra checkboxes in alerts to aid with debugging. Using them for other purposes ceased many years ago as since then using them and having the extra checkbox display means you are making it easier for your visitors to manipulate the way your page works. For example this one that in addition to whatever the script is using it for also asks if you want to turn off JavaScript for the current page (with the checkbox generated by the browser and not able to be turned off from the script). Having them ask if you want to see further alerts or not is also common.

    alert.gif


    For non-debugging use in 2005 or later the page should be updated directly using innerHTML or DOM calls as alert etc were re-purposed at that time exclusively for debugging.
    Once Firefox finally caught up with all the other browsers with a built in debugger alert etc became completely obsolete with no further use at all - any debugging alert should now be replaced with a console.log() call instead.

    Some people now have alert etc completely disabled in their browser as they now serve no useful purpose whatsoever.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  11. #11
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,167
    Mentioned
    453 Post(s)
    Tagged
    8 Thread(s)
    That's interesting, felgall. But as in post 7 above, where it shows how even this site asks if you really want to leave the page, I'm assuming that's purposely put in for the user and not for debugging—even if it is annoying and/or unnecessary.

  12. #12
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,147
    Mentioned
    190 Post(s)
    Tagged
    2 Thread(s)
    Maybe it's an IE term, but I know them by "message box"
    Three types - alert - confirm - prompt

    I have (and still sometimes do) use alert as a "quick and dirty" way when developing code - though I would not advocate using alert in production code.

    confirm and prompt are similar but they ask for user input, not really debugging only


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •