Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]
Groups > comp.lang.javascript > #27340 > unrolled thread
| Started by | Robbie Brown <rob@example.com> |
|---|---|
| First post | 2015-04-12 19:36 +0100 |
| Last post | 2015-04-14 11:37 +0000 |
| Articles | 20 on this page of 33 — 10 participants |
Back to article view | Back to comp.lang.javascript
XMLHttpRequest and Google Chrome Robbie Brown <rob@example.com> - 2015-04-12 19:36 +0100
Re: XMLHttpRequest and Google Chrome JJ <jj4public@vfemail.net> - 2015-04-13 12:33 +0700
Re: XMLHttpRequest and Google Chrome Robbie Brown <rob@example.com> - 2015-04-13 07:41 +0100
Re: XMLHttpRequest and Google Chrome Martin Honnen <mahotrash@yahoo.de> - 2015-04-13 11:30 +0200
Re: XMLHttpRequest and Google Chrome Robbie Brown <rob@example.com> - 2015-04-13 11:50 +0100
Re: XMLHttpRequest and Google Chrome Tim Streater <timstreater@greenbee.net> - 2015-04-13 13:17 +0100
Re: XMLHttpRequest and Google Chrome Robbie Brown <rob@example.com> - 2015-04-13 13:34 +0100
Re: XMLHttpRequest and Google Chrome Tim Streater <timstreater@greenbee.net> - 2015-04-13 14:26 +0100
Re: XMLHttpRequest and Google Chrome Martin Honnen <mahotrash@yahoo.de> - 2015-04-13 16:15 +0200
Re: XMLHttpRequest and Google Chrome Robbie Brown <rob@example.com> - 2015-04-13 16:03 +0100
Re: XMLHttpRequest and Google Chrome Martin Honnen <mahotrash@yahoo.de> - 2015-04-13 19:26 +0200
Re: XMLHttpRequest and Google Chrome "Christoph M. Becker" <cmbecker69@arcor.de> - 2015-04-13 20:23 +0200
Re: XMLHttpRequest and Google Chrome Ben Bacarisse <ben.usenet@bsb.me.uk> - 2015-04-13 15:50 +0100
Re: XMLHttpRequest and Google Chrome Robbie Brown <rob@example.com> - 2015-04-13 16:10 +0100
Re: XMLHttpRequest and Google Chrome "Christoph M. Becker" <cmbecker69@arcor.de> - 2015-04-13 17:46 +0200
Re: XMLHttpRequest and Google Chrome Robbie Brown <rob@example.com> - 2015-04-13 17:28 +0100
Re: XMLHttpRequest and Google Chrome "Christoph M. Becker" <cmbecker69@arcor.de> - 2015-04-13 19:14 +0200
Re: XMLHttpRequest and Google Chrome Tim Streater <timstreater@greenbee.net> - 2015-04-13 18:29 +0100
Re: XMLHttpRequest and Google Chrome Robbie Brown <rob@example.com> - 2015-04-13 18:59 +0100
Re: XMLHttpRequest and Google Chrome "Christoph M. Becker" <cmbecker69@arcor.de> - 2015-04-13 20:29 +0200
Re: XMLHttpRequest and Google Chrome Tim Streater <timstreater@greenbee.net> - 2015-04-13 19:34 +0100
Re: XMLHttpRequest and Google Chrome Robbie Brown <rob@example.com> - 2015-04-13 20:11 +0100
Re: XMLHttpRequest and Google Chrome "Evertjan." <exxjxw.hannivoort@inter.nl.net> - 2015-04-13 20:44 +0200
Re: XMLHttpRequest and Google Chrome Robbie Brown <rob@example.com> - 2015-04-13 20:21 +0100
Re: XMLHttpRequest and Google Chrome Denis McMahon <denismfmcmahon@gmail.com> - 2015-04-14 12:43 +0000
Re: XMLHttpRequest and Google Chrome Robbie Brown <rob@example.com> - 2015-04-14 14:50 +0100
Re: XMLHttpRequest and Google Chrome Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2015-04-14 22:51 +0200
Re: XMLHttpRequest and Google Chrome Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2015-04-13 22:28 +0200
Re: XMLHttpRequest and Google Chrome Robbie Brown <rob@example.com> - 2015-04-13 19:23 +0100
Re: XMLHttpRequest and Google Chrome Tim Streater <timstreater@greenbee.net> - 2015-04-13 19:38 +0100
Re: XMLHttpRequest and Google Chrome "Leonardo Azpurua" <leonardo@exmvps.org> - 2015-04-13 17:36 -0430
Re: XMLHttpRequest and Google Chrome Robbie Brown <rob@example.com> - 2015-04-14 11:35 +0100
Re: XMLHttpRequest and Google Chrome Denis McMahon <denismfmcmahon@gmail.com> - 2015-04-14 11:37 +0000
Page 1 of 2 [1] 2 Next page →
| From | Robbie Brown <rob@example.com> |
|---|---|
| Date | 2015-04-12 19:36 +0100 |
| Subject | XMLHttpRequest and Google Chrome |
| Message-ID | <mgedt0$ki9$1@dont-email.me> |
Chrome 41.0.2272.118
Windows 8.1
Chrome 41.0.2272.118
Ubuntu 12.10
Chrome 26.0.1410.43
Ubuntu 12.04 LTS
all 64bit
I'm having a problem with asynch' javascript requests in the above
versions of Chrome on the above platforms. The same code works fine in
various versions of Firefox and Opera on the above platforms.
The problem is worst on Ubu 12.10, not so bad but annoyingly frequent on
Win 8.1 and hardly happens at all on Ubu 12.04 LTS
Here's the admittedly old function I call to get an XMLHttpRequest object
function newXMLHttpRequest() {
var xmlreq = false;
if (window.XMLHttpRequest) {
// Create XMLHttpRequest object in non-Microsoft browsers
xmlreq = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
try {
xmlreq = new ActiveXObject("MSXML2.XMLHTTP.3.0");
}
catch(e){
try {
// Try to create XMLHttpRequest in later versions
// of Internet Explorer
xmlreq = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e1) {
// Failed to create required ActiveXObject
try {
// Try version supported by older versions
// of Internet Explorer
xmlreq = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e2) {
// Unable to create an XMLHttpRequest with ActiveX
}
}
}
}
return xmlreq;
}
and here's a function I call when a page is loaded
function getCart(){
var req = newXMLHttpRequest();
req.onreadystatechange = getReadyStateHandler(req, updateCart);
req.open("POST", "common/ManageCart?cartmode=crtget", true);
req.setRequestHeader("Content-Type",
"application/x-www-form-urlencoded");
req.send("");
}
updateCart uses javascript DOM to update the innerHTML property of a <div>
The error in the Chrome javascript console is
Uncaught TypeError: Cannot set property 'innerHTML' of null
Like I say, it's only Chrome that has this problem frequently enough to
be a problem
Any ideas on what might be causing this problem in Chrome greatly
appreciated
Thanks
Rob
--
Not floundering ... just fishing
[toc] | [next] | [standalone]
| From | JJ <jj4public@vfemail.net> |
|---|---|
| Date | 2015-04-13 12:33 +0700 |
| Message-ID | <1o6ike5jdijga$.6bk1m7t02buu$.dlg@40tude.net> |
| In reply to | #27340 |
On Sun, 12 Apr 2015 19:36:08 +0100, Robbie Brown wrote: > > updateCart uses javascript DOM to update the innerHTML property of a <div> Where? I don't see the code. > The error in the Chrome javascript console is > > Uncaught TypeError: Cannot set property 'innerHTML' of null > > Like I say, it's only Chrome that has this problem frequently enough to > be a problem The problem is likely caused by whichever function that retrieve the DIV element. Or the required ID or class attribute is missing in the DIV element and/or its parent element.
[toc] | [prev] | [next] | [standalone]
| From | Robbie Brown <rob@example.com> |
|---|---|
| Date | 2015-04-13 07:41 +0100 |
| Message-ID | <mgfodt$gn7$1@dont-email.me> |
| In reply to | #27342 |
On 13/04/15 06:33, JJ wrote: > On Sun, 12 Apr 2015 19:36:08 +0100, Robbie Brown wrote: >> >> updateCart uses javascript DOM to update the innerHTML property of a <div> > > Where? I don't see the code. Didn't show it >> The error in the Chrome javascript console is >> >> Uncaught TypeError: Cannot set property 'innerHTML' of null >> >> Like I say, it's only Chrome that has this problem frequently enough to >> be a problem > > The problem is likely caused by whichever function that retrieve the DIV > element. Or the required ID or class attribute is missing in the DIV element > and/or its parent element. But it only happens intermittently, if there was a fundamental error in the code it wouldn't work at all would it? -- Not floundering ... just fishing
[toc] | [prev] | [next] | [standalone]
| From | Martin Honnen <mahotrash@yahoo.de> |
|---|---|
| Date | 2015-04-13 11:30 +0200 |
| Message-ID | <mgg2bc$1olt$1@adenine.netfront.net> |
| In reply to | #27340 |
Robbie Brown wrote:
> and here's a function I call when a page is loaded
>
> function getCart(){
> var req = newXMLHttpRequest();
> req.onreadystatechange = getReadyStateHandler(req, updateCart);
> req.open("POST", "common/ManageCart?cartmode=crtget", true);
> req.setRequestHeader("Content-Type",
> "application/x-www-form-urlencoded");
> req.send("");
> }
>
> updateCart uses javascript DOM to update the innerHTML property of a <div>
>
> The error in the Chrome javascript console is
>
> Uncaught TypeError: Cannot set property 'innerHTML' of null
Please show the lines of code for which you get the error, the posted
code does not set any innerHTML. And we also need to see the
implementation of getReadyStateHandler.
--- news://freenews.netfront.net/ - complaints: news@netfront.net ---
[toc] | [prev] | [next] | [standalone]
| From | Robbie Brown <rob@example.com> |
|---|---|
| Date | 2015-04-13 11:50 +0100 |
| Message-ID | <mgg70i$19a$1@dont-email.me> |
| In reply to | #27344 |
On 13/04/15 10:30, Martin Honnen wrote:
> Robbie Brown wrote:
>
>> and here's a function I call when a page is loaded
>>
>> function getCart(){
>> var req = newXMLHttpRequest();
>> req.onreadystatechange = getReadyStateHandler(req, updateCart);
>> req.open("POST", "common/ManageCart?cartmode=crtget", true);
>> req.setRequestHeader("Content-Type",
>> "application/x-www-form-urlencoded");
>> req.send("");
>> }
>>
>> updateCart uses javascript DOM to update the innerHTML property of a
>> <div>
>>
>> The error in the Chrome javascript console is
>>
>> Uncaught TypeError: Cannot set property 'innerHTML' of null
>
> Please show the lines of code for which you get the error, the posted
> code does not set any innerHTML. And we also need to see the
> implementation of getReadyStateHandler.
>
Here is the code, please remember that this is a Chrome issue only and
the code works fine in other browsers
function getReadyStateHandler(req, responseXmlHandler) {
return function () {
if (req.readyState == 4) {
if (req.status == 200) {
responseXmlHandler(req.responseXML);
}
else {
alert("HTTP error: "+req.status);
}
}
}
}
function updateCart(cartXML) {
var cartsnapshot = document.getElementById("cartsnapshot");
cartsnapshot.innerHTML = getCartSnapshot(cartXML);
}
function getCartSnapshot(cartXML){
//get the total
var cartTotal =
cartXML.getElementsByTagName("cart")[0].getAttribute("cartTotal");
var total =
cartXML.getElementsByTagName("cart")[0].getAttribute("total");
var lines = cartXML.getElementsByTagName("line");
var cartSnapshot = ("<table cellpadding='2' cellspacing='0'
border='0' style='font-size:0.85em;'>");
if(cartTotal == 0){
cartSnapshot += "<tr><td>Your cart is empty</td></tr></table>";
}
else{
for(var i = 0; i < lines.length; i++){
var currentLine = lines[i];
cartSnapshot += "<tr><td>";
cartSnapshot += currentLine.getAttribute("itemCount");
cartSnapshot += " x " + currentLine.getAttribute("itemId")
+ ": ";
cartSnapshot += currentLine.getAttribute("itemName");
cartSnapshot += "</td></tr>";
}
if(cartTotal > 0){
cartSnapshot += "<tr><td><hr/>";
cartSnapshot += "<td></tr>";
cartSnapshot += "<tr><td>current cart total: <span
class='price'>£" + total + "</span> ";
cartSnapshot += "<td></tr>";
//hard rule
cartSnapshot += "<tr><td><hr/>";
cartSnapshot += "<td></tr>";
//navigation
cartSnapshot += "<tr><td align='left'>";
cartSnapshot += "<a href='Login?mode=checkout'>[checkout]
</a> <a href='common/cartView.jsp'> [view] <a
href='/CartLoader?mode=save'> [save] </a>";
cartSnapshot += "<td></tr>";
}
cartSnapshot += "</table>";
}
return cartSnapshot;
}
--
Not floundering ... just fishing
[toc] | [prev] | [next] | [standalone]
| From | Tim Streater <timstreater@greenbee.net> |
|---|---|
| Date | 2015-04-13 13:17 +0100 |
| Message-ID | <130420151317399772%timstreater@greenbee.net> |
| In reply to | #27345 |
In article <mgg70i$19a$1@dont-email.me>, Robbie Brown <rob@example.com>
wrote:
>function updateCart(cartXML) {
> var cartsnapshot = document.getElementById("cartsnapshot");
> cartsnapshot.innerHTML = getCartSnapshot(cartXML);
>}
Where is the element cartsnapshot defined? Show us its html. ISTM that
there is no such element, in which case
document.getElementById("cartsnapshot") will return null. Or you are
running this javascript before the element is loaded.
--
"... you must remember that if you're trying to propagate a creed of
poverty, gentleness and tolerance, you need a very rich, powerful,
authoritarian organisation to do it." - Vice-Pope Eric
[toc] | [prev] | [next] | [standalone]
| From | Robbie Brown <rob@example.com> |
|---|---|
| Date | 2015-04-13 13:34 +0100 |
| Message-ID | <mggd3o$n6r$1@dont-email.me> |
| In reply to | #27346 |
On 13/04/15 13:17, Tim Streater wrote:
> In article <mgg70i$19a$1@dont-email.me>, Robbie Brown <rob@example.com>
> wrote:
>
>> function updateCart(cartXML) {
>> var cartsnapshot = document.getElementById("cartsnapshot");
>> cartsnapshot.innerHTML = getCartSnapshot(cartXML);
>> }
>
> Where is the element cartsnapshot defined? Show us its html. ISTM that
> there is no such element, in which case
> document.getElementById("cartsnapshot") will return null. Or you are
> running this javascript before the element is loaded.
>
Jeez, It's like herding cats sometimes.
I have mentioned repeatedly that this code only causes problems in
Chrome, it works fine in other browsers
anyway, here's the html
<div id="rightcolumn" ondrop="dropOnList(event)"
ondragover="allowListDrop(event)">
<!-- cart -->
<div class="strbox">
<div class="top">
<img src="/static/cart.gif" alt='cart' title='cart'> Shopping Cart
</div>
<div class="middle">
<img src="/static/ukccheader.jpg" width='160' alt='Pay securely'
title='Pay securely'>
<div id="cartsnapshot">
<!-- if the cart doesn't appear here provide a button to allow a refresh -->
<div style="margin-top:7px; margin-bottom: 7px; overflow:hidden;
text-align:center">
<div style="font-size: 0.9em; font-weight:bold;">
Network congestion
</div>
<div style="margin-top: 7px;">
<input type='button' value="Refresh cart"
style="font-weight: bold;" onclick='getCart()'>
</div>
</div>
</div>
</div>
</div>
there is a common header that is included with every page
in the <head> of the common header I have this
<script type="text/javascript">
window.onload=getCart();
</script>
Once again, this is only a problem in some versions of Chrome.
--
Not floundering ... just fishing
[toc] | [prev] | [next] | [standalone]
| From | Tim Streater <timstreater@greenbee.net> |
|---|---|
| Date | 2015-04-13 14:26 +0100 |
| Message-ID | <130420151426217111%timstreater@greenbee.net> |
| In reply to | #27347 |
In article <mggd3o$n6r$1@dont-email.me>, Robbie Brown <rob@example.com>
wrote:
>On 13/04/15 13:17, Tim Streater wrote:
>> In article <mgg70i$19a$1@dont-email.me>, Robbie Brown <rob@example.com>
>> wrote:
>>
>>> function updateCart(cartXML) {
>>> var cartsnapshot = document.getElementById("cartsnapshot");
>>> cartsnapshot.innerHTML = getCartSnapshot(cartXML);
>>> }
>>
>> Where is the element cartsnapshot defined? Show us its html. ISTM that
>> there is no such element, in which case
>> document.getElementById("cartsnapshot") will return null. Or you are
>> running this javascript before the element is loaded.
>>
>
>Jeez, It's like herding cats sometimes.
Look, d'ye want help or not?
>I have mentioned repeatedly that this code only causes problems in
>Chrome, it works fine in other browsers
To me, that indicates that you're doing something in a non-guaranteed
way that just happens to work in those other browsers, but in Chrome
won't because Chrome happens to do things in a different order.
>there is a common header that is included with every page
>
>in the <head> of the common header I have this
>
><script type="text/javascript">
> window.onload=getCart();
></script>
Personally I tend to do:
<body onload="getCart();">
which works for me, doubtless others may have other preferences.
--
Anyone who slaps a 'this page is best viewed with Browser X' label on
a Web page appears to be yearning for the bad old days, before the Web,
when you had very little chance of reading a document written on another
computer, another word processor, or another network. -- Tim Berners-Lee
[toc] | [prev] | [next] | [standalone]
| From | Martin Honnen <mahotrash@yahoo.de> |
|---|---|
| Date | 2015-04-13 16:15 +0200 |
| Message-ID | <mggj26$2cds$1@adenine.netfront.net> |
| In reply to | #27347 |
Robbie Brown wrote: > <script type="text/javascript"> > window.onload=getCart(); > </script> You should set window.onload = getCart; to have the function "getCart" called when the onload handler fires. Your version calls "getCart" directly and assigns it result (which is undefined) to the onload handler. --- news://freenews.netfront.net/ - complaints: news@netfront.net ---
[toc] | [prev] | [next] | [standalone]
| From | Robbie Brown <rob@example.com> |
|---|---|
| Date | 2015-04-13 16:03 +0100 |
| Message-ID | <mgglqc$ojl$1@dont-email.me> |
| In reply to | #27349 |
On 13/04/15 15:15, Martin Honnen wrote: > Robbie Brown wrote: > >> <script type="text/javascript"> >> window.onload=getCart(); >> </script> > > You should set > > window.onload = getCart; > > to have the function "getCart" called when the onload handler fires. > Your version calls "getCart" directly and assigns it result (which is > undefined) to the onload handler. Sorry, I don't understand, if I do as you say the function is never called and the cart is never updated ...in fact this breaks the entire ajax call in all browsers, can you elucidate, thanks. -- Not floundering ... just fishing
[toc] | [prev] | [next] | [standalone]
| From | Martin Honnen <mahotrash@yahoo.de> |
|---|---|
| Date | 2015-04-13 19:26 +0200 |
| Message-ID | <mggu7s$12ud$1@adenine.netfront.net> |
| In reply to | #27351 |
Robbie Brown wrote:
> On 13/04/15 15:15, Martin Honnen wrote:
>> Robbie Brown wrote:
>>
>>> <script type="text/javascript">
>>> window.onload=getCart();
>>> </script>
>>
>> You should set
>>
>> window.onload = getCart;
>>
>> to have the function "getCart" called when the onload handler fires.
>> Your version calls "getCart" directly and assigns it result (which is
>> undefined) to the onload handler.
>
> Sorry, I don't understand, if I do as you say the function is never
> called and the cart is never updated ...in fact this breaks the entire
> ajax call in all browsers, can you elucidate, thanks.
I don't see why window.onload should not fire for you. Are there other
scripts in the whole code that also try to set window.onload?
Is that page online somewhere to check?
In general these days, unless you need to support IE 8, it should
suffice to use the DOMContentLoaded event instead e.g. instead of
window.onload = getCart;
you can set
document.addEventListener('DOMContentLoaded', function(evt) {
getCart(); } false);
as window.onload waits for all resources like images to load while
DOMContentLoaded should fire once the document's source has been parsed
and the DOM has been built, without waiting for images or other
resources to load completely.
--- news://freenews.netfront.net/ - complaints: news@netfront.net ---
[toc] | [prev] | [next] | [standalone]
| From | "Christoph M. Becker" <cmbecker69@arcor.de> |
|---|---|
| Date | 2015-04-13 20:23 +0200 |
| Message-ID | <mgh1ir$u6g$1@solani.org> |
| In reply to | #27356 |
Martin Honnen wrote:
> In general these days, unless you need to support IE 8, it should
> suffice to use the DOMContentLoaded event instead e.g. instead of
> window.onload = getCart;
> you can set
> document.addEventListener('DOMContentLoaded', function(evt) {
> getCart(); } false);
> as window.onload waits for all resources like images to load while
> DOMContentLoaded should fire once the document's source has been parsed
> and the DOM has been built, without waiting for images or other
> resources to load completely.
Or even simpler:
document.addEventListener('DOMContentLoaded', getCart, false);
--
Christoph M. Becker
[toc] | [prev] | [next] | [standalone]
| From | Ben Bacarisse <ben.usenet@bsb.me.uk> |
|---|---|
| Date | 2015-04-13 15:50 +0100 |
| Message-ID | <87h9skyte6.fsf@bsb.me.uk> |
| In reply to | #27347 |
Robbie Brown <rob@example.com> writes: <snip> > there is a common header that is included with every page > > in the <head> of the common header I have this > > <script type="text/javascript"> > window.onload=getCart(); > </script> This looks wrong. Did you mean 'window.onload=getCart'? The async HTTP handler will run when there is no guarantee that the element it will modify is present yet. <snip> -- Ben.
[toc] | [prev] | [next] | [standalone]
| From | Robbie Brown <rob@example.com> |
|---|---|
| Date | 2015-04-13 16:10 +0100 |
| Message-ID | <mggm7e$qbf$1@dont-email.me> |
| In reply to | #27350 |
On 13/04/15 15:50, Ben Bacarisse wrote: > Robbie Brown <rob@example.com> writes: > <snip> >> there is a common header that is included with every page >> >> in the <head> of the common header I have this >> >> <script type="text/javascript"> >> window.onload=getCart(); >> </script> > > This looks wrong. Did you mean 'window.onload=getCart'? The async HTTP > handler will run when there is no guarantee that the element it will > modify is present yet. > > <snip> > But this doesn't work at all as I explained earlier. If I have a function called getCart() how does getCart call it? Obviously I'm missing something here. Can anyone put me out of my misery? Thanks -- Not floundering ... just fishing
[toc] | [prev] | [next] | [standalone]
| From | "Christoph M. Becker" <cmbecker69@arcor.de> |
|---|---|
| Date | 2015-04-13 17:46 +0200 |
| Message-ID | <mggock$rt7$1@solani.org> |
| In reply to | #27352 |
Robbie Brown wrote: > On 13/04/15 15:50, Ben Bacarisse wrote: >> Robbie Brown <rob@example.com> writes: >> <snip> >>> there is a common header that is included with every page >>> >>> in the <head> of the common header I have this >>> >>> <script type="text/javascript"> >>> window.onload=getCart(); >>> </script> >> >> This looks wrong. Did you mean 'window.onload=getCart'? The async HTTP >> handler will run when there is no guarantee that the element it will >> modify is present yet. > > But this doesn't work at all as I explained earlier. > If I have a function called getCart() how does getCart call it? > > Obviously I'm missing something here. > > Can anyone put me out of my misery? The onload property of the window element is supposed to hold the reference to a Function object (or null). This function object is automatically called (with a single argument, namely the respective Event object[1]) after the documented has been loaded. In your case you're assigning the return value of getCart() to the property. The return value is undefined, and will be cast to null, so no function will be called when the document has been loaded. Instead getCart is called right before the assignment, which causes the XHR to be triggered immediately. The rest is timing dependend. [1] This argument isn't supplied in old versions of MSHTML. -- Christoph M. Becker
[toc] | [prev] | [next] | [standalone]
| From | Robbie Brown <rob@example.com> |
|---|---|
| Date | 2015-04-13 17:28 +0100 |
| Message-ID | <mggqp5$cu6$1@dont-email.me> |
| In reply to | #27353 |
On 13/04/15 16:46, Christoph M. Becker wrote: > Robbie Brown wrote: > <snip> >> Can anyone put me out of my misery? > > The onload property of the window element is supposed to hold the > reference to a Function object (or null). This function object is > automatically called (with a single argument, namely the respective > Event object[1]) after the documented has been loaded. > > In your case you're assigning the return value of getCart() to the > property. The return value is undefined, and will be cast to null, so > no function will be called when the document has been loaded. > > Instead getCart is called right before the assignment, which causes the > XHR to be triggered immediately. The rest is timing dependend. I'm starting to think it's a timing issue, maybe I've been lucky to have things working so far. I still don't understand this whole getCart versus getCart() thing, maybe it's something fundamental that I'm missing. How do I ensure the function getCart() is called after everything is loaded, maybe that will give me an insight. Thanks > > [1] This argument isn't supplied in old versions of MSHTML. > -- Not floundering ... just fishing
[toc] | [prev] | [next] | [standalone]
| From | "Christoph M. Becker" <cmbecker69@arcor.de> |
|---|---|
| Date | 2015-04-13 19:14 +0200 |
| Message-ID | <mggti5$eo5$1@solani.org> |
| In reply to | #27354 |
Robbie Brown wrote: > On 13/04/15 16:46, Christoph M. Becker wrote: > >> The onload property of the window element is supposed to hold the >> reference to a Function object (or null). This function object is >> automatically called (with a single argument, namely the respective >> Event object[1]) after the documented has been loaded. >> >> In your case you're assigning the return value of getCart() to the >> property. The return value is undefined, and will be cast to null, so >> no function will be called when the document has been loaded. >> >> Instead getCart is called right before the assignment, which causes the >> XHR to be triggered immediately. The rest is timing dependend. > > I'm starting to think it's a timing issue, maybe I've been lucky to have > things working so far. I still don't understand this whole getCart > versus getCart() thing, maybe it's something fundamental that I'm missing. > > How do I ensure the function getCart() is called after everything is > loaded, maybe that will give me an insight. As other have already said: window.onload = getCart; -- Christoph M. Becker
[toc] | [prev] | [next] | [standalone]
| From | Tim Streater <timstreater@greenbee.net> |
|---|---|
| Date | 2015-04-13 18:29 +0100 |
| Message-ID | <130420151829307070%timstreater@greenbee.net> |
| In reply to | #27354 |
In article <mggqp5$cu6$1@dont-email.me>, Robbie Brown <rob@example.com>
wrote:
>On 13/04/15 16:46, Christoph M. Becker wrote:
>> Robbie Brown wrote:
>>
><snip>
>
>>> Can anyone put me out of my misery?
>>
>> The onload property of the window element is supposed to hold the
>> reference to a Function object (or null). This function object is
>> automatically called (with a single argument, namely the respective
>> Event object[1]) after the documented has been loaded.
>>
>> In your case you're assigning the return value of getCart() to the
>> property. The return value is undefined, and will be cast to null, so
>> no function will be called when the document has been loaded.
>>
>> Instead getCart is called right before the assignment, which causes the
>> XHR to be triggered immediately. The rest is timing dependend.
>
>I'm starting to think it's a timing issue, maybe I've been lucky to have
>things working so far. I still don't understand this whole getCart
>versus getCart() thing, maybe it's something fundamental that I'm missing.
You need to assign a function to the onload property. In fact you
already do this sort of thing here:
function getReadyStateHandler(req, responseXmlHandler) {
return function () { ... }
and here:
req.onreadystatechange = getReadyStateHandler(req, updateCart);
where your getReadyStateHandler function returns a reference to a
function (don't argue, yes it does, it says "return function ...").
In exactly the same way, this code:
>> <script type="text/javascript">
>> window.onload=getCart();
>> </script>
ought to assign a function to the onload handler. The function you want
to assign is getCart, hence you need to say:
window.onload = getCart;
This will cause getCart to be run when the onload is complete and not
before. With what you had, getCart is run as soon as:
window.onload=getCart();
is encountered, which will likely be before the onload is complete,
meaning that <div id="cartsnapshot"> may or may not be known to the
browser at that point. So whether it works or not is down to timing.
So - notice the difference between:
window.onload = getCart;
and:
<body onload="getCart();">
The first requires a function reference. In the second, you put some
javascript to be executed. So you could put:
<body onload="alert('Boo!');">
and to get the same effect with window.onload needs:
window.onload = function () { alert('Boo!'); };
--
"I love the way that Microsoft follows standards.
In much the same manner as fish follow migrating caribou."
- Paul Tomblin, ASR
[toc] | [prev] | [next] | [standalone]
| From | Robbie Brown <rob@example.com> |
|---|---|
| Date | 2015-04-13 18:59 +0100 |
| Message-ID | <mgh03o$3lk$1@dont-email.me> |
| In reply to | #27357 |
On 13/04/15 18:29, Tim Streater wrote:
> In article <mggqp5$cu6$1@dont-email.me>, Robbie Brown <rob@example.com>
> wrote:
>
>> On 13/04/15 16:46, Christoph M. Becker wrote:
>>> Robbie Brown wrote:
>>>
>> <snip>
>>
>>>> Can anyone put me out of my misery?
>>>
>>> The onload property of the window element is supposed to hold the
>>> reference to a Function object (or null). This function object is
>>> automatically called (with a single argument, namely the respective
>>> Event object[1]) after the documented has been loaded.
>>>
>>> In your case you're assigning the return value of getCart() to the
>>> property. The return value is undefined, and will be cast to null, so
>>> no function will be called when the document has been loaded.
>>>
>>> Instead getCart is called right before the assignment, which causes the
>>> XHR to be triggered immediately. The rest is timing dependend.
>>
>> I'm starting to think it's a timing issue, maybe I've been lucky to
>> have things working so far. I still don't understand this whole
>> getCart versus getCart() thing, maybe it's something fundamental that
>> I'm missing.
>
> You need to assign a function to the onload property. In fact you
> already do this sort of thing here:
>
> function getReadyStateHandler(req, responseXmlHandler) {
> return function () { ... }
>
> and here:
>
> req.onreadystatechange = getReadyStateHandler(req, updateCart);
>
> where your getReadyStateHandler function returns a reference to a
> function (don't argue, yes it does, it says "return function ...").
>
> In exactly the same way, this code:
>
>>> <script type="text/javascript">
>>> window.onload=getCart();
>>> </script>
>
> ought to assign a function to the onload handler. The function you want
> to assign is getCart, hence you need to say:
>
> window.onload = getCart;
>
> This will cause getCart to be run when the onload is complete and not
> before. With what you had, getCart is run as soon as:
>
> window.onload=getCart();
>
> is encountered, which will likely be before the onload is complete,
> meaning that <div id="cartsnapshot"> may or may not be known to the
> browser at that point. So whether it works or not is down to timing.
>
> So - notice the difference between:
>
> window.onload = getCart;
>
> and:
>
> <body onload="getCart();">
>
> The first requires a function reference. In the second, you put some
> javascript to be executed. So you could put:
>
> <body onload="alert('Boo!');">
>
> and to get the same effect with window.onload needs:
>
> window.onload = function () { alert('Boo!'); };
OK, I did a test.
In <head> I have
<script type="text/javascript">>
window.onload = getCart();
</script>
In getCart() I put an alert as the first line
(incidentally getCart() is in a file that is referenced thusly in <head>
<script type="text/javascript" src="/javascript/cart.js"></script>
before the call obviously)
alert("hello");
when I load any page in Firefox (and occasionally in Chrome) I get
"hello" *before* the page is displayed
if I change <head>
<script type="text/javascript">
window.onload = getCart;
</script>
The function doesn't get called, I get no "hello"
This is the same in all my browsers. I have no idea why as you and
others say that getCart should work, it simply doesn't. I'm not making
it up, it doesn't execute, I'm not mistaken, so, obviously something is
still missing.
So it's back to the drawing board and javascript console.
Thank you all for all your help but the problem still exists.
--
Not floundering ... just fishing
[toc] | [prev] | [next] | [standalone]
| From | "Christoph M. Becker" <cmbecker69@arcor.de> |
|---|---|
| Date | 2015-04-13 20:29 +0200 |
| Message-ID | <mgh1ts$ve1$1@solani.org> |
| In reply to | #27358 |
Robbie Brown wrote:
> if I change <head>
>
> <script type="text/javascript">
> window.onload = getCart;
> </script>
>
> The function doesn't get called, I get no "hello"
> This is the same in all my browsers. I have no idea why as you and
> others say that getCart should work, it simply doesn't. I'm not making
> it up, it doesn't execute, I'm not mistaken, so, obviously something is
> still missing.
Martin Honnen has already mentionend[1] that it is possible that some
other code overwrites the onload property of the window element. You
can work around that by registering an event handler[2]:
window.addEventListener("load", getCart, false);
[1] <mggu7s$12ud$1@adenine.netfront.net>
[2] This will not work in clients which don't implement the DOM Level 2
Event specification, most notably IE 8 and below.
--
Christoph M. Becker
[toc] | [prev] | [next] | [standalone]
Page 1 of 2 [1] 2 Next page →
Back to top | Article view | comp.lang.javascript
csiph-web