Develop Reference

JS Disable browser back button as soon as your page is ready

I am trying to disable the browser back button via JS code and have already seen lot of answers like
How can I stop the browser back button using JavaScript?
and
Trying to disable the browser's back button
But my problem is unique, The issue is that once my page is loaded and I don't click inside the document (Anywhere on the page) my browser back button still function the way it use to.
But If I click inside the document/page, all the above scripts and code works properly.
So the I want to ask that if there is any way I can make the document(page) active somehow so that if the user click directly on back button without clicking inside the page, They should not go back.

How to hide a transient web page once it's been used?

I have the following situation
Home Page -- User clicks a link, which directs them to a JS-generated page, which may be time intensive
JS-page does some work and may display a "timer" saying work will be done in X seconds, and redirects user to a PDF
PDF page is shown to the user
Problem:
Once the user is done with PDF, they click "Back" button on the browser, hoping to go back to Home Page, but instead they go to JS page, as that's how browsers work -- they step back once. Naturally that displays the timer again and redirects users right back to PDF.
How do I structure my software so that when users are done with PDF, clicking Back (or some other simple way) takes them back to the Home Page?
Simple work-around is for users to click back twice in quick succession, but that's kind of inconvenient - breaks usability of this particular piece for the users and I don't want to do that.
EDIT For Code:
PHP side:
case "export-to-pdf":
$printpdf->generateCanvasInBrowser();
break;
HTML/JS side:
public function generateCanvasInBrowser()
{
//generate form with data
//submit form to PHP script
document.forms['form'].submit();
}
PHP-side:
//Takes and processes POST-ed data from form, and generates PDF
<?
echo printPDF();
EDIT For solution try:
I did a modal dialog with Java Script (https://stackoverflow.com/a/15582060/2883328), and now JS page shows up in an overlay div, but then also does the PDF. It shows up in the dialog box, not in the main browser. It looks fair enough, but still breaks expected functionality for the user as they are used to clicking back from PDF to home page. With this one I'll need to find a way to submit the form AND get out of the modal box.

(moving over from my comment, which seemed to fix the problem mostly)
The best way to fix this is to display the countdown on the home page itself. That would avoid the problem altogether, because then you wouldn't load any page in between. If you use a modal, for example, which contains the js-generated page, then you will need to make sure to submit the form to the top page. You can do that by adding target="_top" to your <form> tag.
I hope this works for you.

Generate the JS Page INSIDE A DIV in the Home page and work widh "visibility: collapse" to show or hide .if you use JQuery use ("#div").hide() and .show()
That should be a lot easier and solve your problem

Hyperlink + Javascript = One click?

Is it possible to integrate a javascript into a hyperlink? Or make it into some sort of batch script or whatnot, so when the page has loaded it calls the javascript which is a button on the page?
To explain it further:
We have this page:
http://work.acceptance.XXXX.com/XXXX_Raffle/Lists/Raffle/overview.aspx
The sharepoint page has a survey on it.
To get the "popup" window to show, so you can answer a question in the survey, you need to press a button which calls this script:
javascript:__doPostBack('ctl00$m$g_e999ab40_719f_42fb_bd61_d986f232bdd5$ctl01$ctl00$toolBarTbl$RptControls$ctl00$diidIONewItem','');
So, is it possible to somehow combine the page + the javascript, so all they have to do is press one link or alternatively, a hyperlink which goes to a file on a server which triggers all this, so they instantly get to the page + the javascript automatically pops so they dont have to press the button?
Keep in mind, when I say "hyperlink" I mean the kind of hyperlink you would see in an email. A simple link to a website or a server location.
I'm not very good at everything that has to do with programming and webdesign, but I do have access to the sharepoint, though I'd need serious guiding in how to add anything there other than simple webparts. It's SharePoint Server 2010.
Here is a picture of the button and what happens when you press it.
http://i.stack.imgur.com/gKCG5.jpg

Add an onload event to the page to get it to show the popup:
<script type="text/javascript">
window.onload = showPopup();
function showPopup() {
__doPostBack('ctl00$m$g_e999ab40_719f_42fb_bd61_d986f232bdd5$ctl01$ctl00$toolBarTbl$RptControls$ctl00$diidIONewItem','');
}
</script>
This needs to go on the page that you're linking to so that the link takes you to this page which then fires this onload. Put it before the closing tag on the page.

No. You cannot construct a URL that will load a document and then call some JavaScript.
You would have to modify the page you are linking to so it runs the JS automatically. It could look at the URL and run that function conditionally though (e.g. if (location.hash === '#foo') { ... }.)

Prevent PrettyPhoto from closing

the script i created uses PrettyPhoto to load an ifram on which there is an upload page going on, the upload works great the image is uploaded and the url is returned back to the page for preview, but not saved into the database just yet...
so far so good, i just want to add a function that if a picture is not saved and the user hits close button it will promt to either save or dismiss which it will make an ajax call to either remove the uploaded picture or save its url into the database
does anyone have an idea how to do that? not the ajax part i have everything under control, just need to know how to prevent the prettyphoto close button from closing directly
ps: i tried the callback function but what it does it that it closes then executes, but i need the execution to be done before closing
any help would be much appreciated
thank you

you can tweak the prettyPhoto js code but that will effect all your popups, so as you found the workaround of the close function inside the iframe then that's it, you didn't have to duplicate themes and hide the close button on the its stylesheet, you could have simply let jquery do so from withing the iframe, just include this code into your iframe
<script type="text/javascript">
$(document).ready(function() {
window.parent.$('.pp_close').css('display', 'none');
});
</script>

In javascript, how can I detect when the browser brings up the open/save/cancel prompt when loading a file?

In javascript, how can I detect when the browser brings up the open/save/cancel prompt when loading a file?
If possible, is it the same for all browsers?
I'm trying to fix a problem with users clicking a download button, being impatient and clicking it again, and again which is taxing our servers. I tried just hiding the button while the file is processed, but the icon will come back before the open/save/cancel prompt shows up.
The code goes something like this:
...
users clicks button,
button hides,
external process gets the file,
button appears ...

You can't.
How the browser deals with a requested resource - open it, start an external application, offer a "save" dialog - is outside of what you can control using JavaScript.

You can't! No way, that's it!