Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]


Groups > comp.lang.javascript > #27340 > unrolled thread

XMLHttpRequest and Google Chrome

Started byRobbie Brown <rob@example.com>
First post2015-04-12 19:36 +0100
Last post2015-04-14 11:37 +0000
Articles 20 on this page of 33 — 10 participants

Back to article view | Back to comp.lang.javascript


Contents

  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 →


#27340 — XMLHttpRequest and Google Chrome

FromRobbie Brown <rob@example.com>
Date2015-04-12 19:36 +0100
SubjectXMLHttpRequest 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]


#27342

FromJJ <jj4public@vfemail.net>
Date2015-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]


#27343

FromRobbie Brown <rob@example.com>
Date2015-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]


#27344

FromMartin Honnen <mahotrash@yahoo.de>
Date2015-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]


#27345

FromRobbie Brown <rob@example.com>
Date2015-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'>&pound;" + 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]


#27346

FromTim Streater <timstreater@greenbee.net>
Date2015-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]


#27347

FromRobbie Brown <rob@example.com>
Date2015-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'>&nbsp;  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]


#27348

FromTim Streater <timstreater@greenbee.net>
Date2015-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]


#27349

FromMartin Honnen <mahotrash@yahoo.de>
Date2015-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]


#27351

FromRobbie Brown <rob@example.com>
Date2015-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]


#27356

FromMartin Honnen <mahotrash@yahoo.de>
Date2015-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]


#27359

From"Christoph M. Becker" <cmbecker69@arcor.de>
Date2015-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]


#27350

FromBen Bacarisse <ben.usenet@bsb.me.uk>
Date2015-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]


#27352

FromRobbie Brown <rob@example.com>
Date2015-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]


#27353

From"Christoph M. Becker" <cmbecker69@arcor.de>
Date2015-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]


#27354

FromRobbie Brown <rob@example.com>
Date2015-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]


#27355

From"Christoph M. Becker" <cmbecker69@arcor.de>
Date2015-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]


#27357

FromTim Streater <timstreater@greenbee.net>
Date2015-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]


#27358

FromRobbie Brown <rob@example.com>
Date2015-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]


#27361

From"Christoph M. Becker" <cmbecker69@arcor.de>
Date2015-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