Develop Reference

Loading JavaScript Function when loading new php page

I have a button that includes a location.href = "home.php" This redirects to the home page fine, however if this button is pressed i need a function to run from the JavaScript. I don't want to do a document load in JavaScript as this should only appear when a certain button takes you home. I need to POST value and say if(isset($_POST['value'])) I just cant get this to work.
$(function () {
$('#receiptButton').click(function () {
location.href = "home.php";
show_receipts();
});
});
i need the show_receipts(); to run once home.php is loaded. I believe using ajax is the correct way, but i cant redirect to the page and run the function.

Javascript Calling Function In Function Not Working

I'm trying to create a very simple chat system with auto refresh and refresh on submission of new chat message from the user.
I currently have two functions - one for submitting the new message, clearing the form and refreshing the chat (using the next function) called clearchat():
function clearchat() {
var frm = document.getElementById('chatform');
document.getElementById('fullmessage').value = document.getElementById('chatmsg').value;
frm.submit(); // form is being submitted to a hidden iframe.
frm.reset();
refreshchat();
}
And then the other that refreshes the chat that should be called when clearchat() runs and is also called every 3 seconds using an interval:
function refreshchat() {
$('#qcwindow').load(document.URL + ' #qctext');
$('#chatwindow').load(document.URL + ' #chattext');
var chatwindow = document.getElementById('chatwindow');
var difference = chatwindow.scrollHeight - chatwindow.scrollTop;
if(difference < 750) {
chatwindow.scrollTop = chatwindow.scrollHeight;
}
}
This function loads the new chat information into the DIV and then keeps it scrolled to the bottom of the div unless the user has manually scrolled away from the bottom of the div.
Both functions work individually. The problem I'm having is that when the user submits a new message it does submit the form and clear the form but it does not refresh the chat. The chat still automatically refreshes every 3 seconds, though. But I'd like the new message from the user to show up instantly.
I cannot figure out for the life of me why the refreshchat() function inside the clearchat() function isn't being called.
Any help would be appreciated. Thanks.
UPDATE:
I've added console_log("refrehsed") to the refreshchat() function and it gets added to the log every time both through hitting enter manually and also the auto refresh but the div only actually updates on the auto refresh.

When you submit the form to an iframe, you should wait for the post to finish before updating the UI. You can know that the form finished submitting by listening to the load event of the iframe the form is targeting.

How to go back to previous page using Javascript in ASP.NET

I have the following scenario:
I have the following script in my page:
function GoBackToPreviousPage () {
parent.history.back();
return false;
}
In Code Behind I have the following
If (some conditions are met)
Page.ClientScript.RegisterStartupScript(this.GetType(), "GoBackToPreviousPage", "GoBackToPreviousPage();", true);
If the conditions are met I want the page to go back to the previous page,
the reason I'm doing this in javascript instead of on the server
is because (parent.history.back();) maintains a history of all the previous pages
I noticed that the after the RegisterStartupScript is executed and postback happens the script is executed but it stays on the same page, it does not go back to the previous page

The problem is caused by the PostBack that occurs before the execution of the javascript function. You click the button and the current page is saved in the browser history. So, when the page reloads and the script executes, you are in the same page. So, a not-so-pretty solution is to go back two pages in history:
function GoBackToPreviousPage() {
window.history.go(-2);
return false;
}

Detect first page load with jQuery?

I need to detect the first time a page loads in jQuery so that I can perform some actions only when the page loads the first time a user navigates to that page. Similar to server side code page.ispostbasck. I have tested $(document).ready and it fires every time the page loads so this will not provide what I need. I have also tried the jQuery Load function - it also fires every page load. So by page load an example is that I have an HTML input tag on the page of type button and it does not fire a postback (like an asp.net button) but it does reload the page and fires $(document).ready
Thanks

You will have to use cookie to store first load information:
if (! $.cookie("cookieName")){
// do your stuff
// set cookie now
$.cookie("cookieName", "firstSet", {"expires" : 7})
}
Note: Above example uses jQuery Cookie plugin.

An event doesn't exist that fires only when the page is loaded for the first time.
You should use jQuery's .ready() event, and then persist the fact that you've handled a first time page load using your method of choice (i.e. cookie, session variable, local storage, etc.).
Note: This method will never be fool proof unless you can store this information at the user level in a DB. Otherwise, as soon as the user clears their cookies, or whatever method you choose, the "first time loaded" code will fire again.

I just ran into this problem and this is how I handled it. Keep track of the first time the page loads by using a variable initialLoad:
var initialLoad = true;
$(document).ready(function() {
...
...
...
initialLoad = false;
});
Then in other functions, you can do this:
if (initialLoad) {
//Do work that is done when the page was first refreshed/loaded.
} else {
//Do work when it's not the initial load.
}
This works well for me. If the user is already on the page and some jQuery functions run, I now know if that user just loaded the page or if they were already on the page.

The easy solution is to use jQuery ‘Once’ plugin
$(element).once('class-name', function() {
// your javascript code
});

Running javascript whenever UpdatePanel refreshes

I am using an asp.net update panel to refresh the content on a page when a menu item is selected.
Within the content that is updated are images which have a javascript reflection function which is triggered with the following line of code:
window.onload = function () { addReflections(); }
This runs fine when the page is first loaded but not when a menu item is selected and the update panel is run.
On previous projects using jquery code I have replaced document.ready with function pageLoad but there is no document.ready on this page.

Like this:
<script>
// ASP.NET AJAX on update complete
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_endRequest(function(sender, args) {
// your code here, eg initToolTips('/Common/images/global/popup3.gif');
});

Basically, it's because that event isn't triggered by an update panel refresh.
There are ways to achieve this behaviour though, Ajax.Net has an EndRequestHandler function that you can hook into.
Here's a good example:
http://zeemalik.wordpress.com/2007/11/27/how-to-call-client-side-javascript-function-after-an-updatepanel-asychronous-ajax-request-is-over/

i think u should use
function pageLoad(sender, arg) {
if (!arg.get_isPartialLoad()) {
// in first load only
}
//every time the update panel refreshed
}
Regards

Take a look to this event:
http://msdn.microsoft.com/en-us/library/bb383810.aspx
window.onload is fired when the entire page is loaded. UpdatePanel uses an AJAX approach, so whenever it's updated and round trip ends, the page remains loaded and only a portion of this has been updated.
In other words, you need to do that "when a request to the server ends".