As mentioned in the comments, `onerror` fires when there is a failure on the *network level*. If the error only exists on the application level, e.g., an HTTP error code is sent, then `onload` still fires.  You need to test the returned status code explicitly in your `onreadystatechange` handler.

Note that a denied cross-domain request will also fire the `onerror` handler.

In addition to apsillers&#39; answer, note that XMLHttpRequest handles redirects automatically in the background, so you don&#39;t have to check for this reply codes in the `onload` event (this event will be invoked only once - on the final call). Also note, that in case you send payload data with the POST method and if the requests is redirected, XMLHttpRequest change the method from `POST` to `GET` and discards any payload data for security reasons. The `onload` event will still be invoked but you will need to re-send your request manually again to the new destination.

I&#39;m using requireJS to load scripts. It has [this detail in the docs][1]:

&gt; The path that is used for a module name should not include the .js
&gt; extension, since the path mapping could be for a directory.

In my app, I map all of my script files in a config path, because they&#39;re dynamically generated at runtime (my scripts start life as things like `order.js` but become things like `order.min.b25a571965d02d9c54871b7636ca1c5e.js` (this is a hash of the file contents, for cachebusting purposes). 

In some cases, require will add a second .js extension to the end of these paths. Although I generate the dynamic paths on the server side and then populate the config path, I have to then write some extra javascript code to remove the `.js` extension from the problematic files.

Reading the requireJS docs, I really don&#39;t understand why you&#39;d ever want the path mapping to be used for a directory. Does this mean it&#39;s possible to somehow load an entire directory&#39;s worth of files in one call? I don&#39;t get it.

Does anybody know if it&#39;s possible to just force require to stop adding .js to file paths so I don&#39;t have to hack around it?

thanks.


  [1]: http://requirejs.org/docs/api.html#config

UPDATE: added some code samples as requested.

This is inside my HTML file (it&#39;s a Scala project so we can&#39;t write these variables directly into a `.js` file):

    foo.js.modules = {
        order               : &#39;@Static(&quot;javascripts/order.min.js&quot;)&#39;,
        reqwest             : &#39;http://5.foo.appspot.com/js/libs/reqwest&#39;,
        bean                : &#39;http://4.foo.appspot.com/js/libs/bean.min&#39;,
        detect              : &#39;order!http://4.foo.appspot.com/js/detect/detect.js&#39;,
        images              : &#39;order!http://4.foo.appspot.com/js/detect/images.js&#39;,
        basicTemplate       : &#39;@Static(&quot;javascripts/libs/basicTemplate.min.js&quot;)&#39;,
        trailExpander       : &#39;@Static(&quot;javascripts/libs/trailExpander.min.js&quot;)&#39;,
        fetchDiscussion     : &#39;@Static(&quot;javascripts/libs/fetchDiscussion.min.js&quot;)&#39;
        mostPopular         : &#39;@Static(&quot;javascripts/libs/mostPopular.min.js&quot;)&#39;
    };

Then inside my `main.js`:


    requirejs.config({
        paths: foo.js.modules
    });

    require([foo.js.modules.detect, foo.js.modules.images, &quot;bean&quot;], 
        function(detect, images, bean) {
            // do stuff
    });

In the example above, I have to use the string &quot;bean&quot; (which refers to the require path) rather than my direct object (like the others use `foo.js.modules.bar`) otherwise I get the extra `.js` appended.

Hope this makes sense.

Is it possible to stop requireJS from adding the .js file extension automatically?

Can I use `viewDidLoad` method in `UITableviewCell`?

Can I use viewDidLoad method in UITableviewCell?

I have a little problem understanding `XMLHttpRequest`&#39;s handlers. [The specification says this about the `onerror` handler][1]:

&gt; `error`   [Dispatched ... ] When the request has failed.
&gt;
&gt; `load`    [Dispatched ... ] When the request has successfully completed.

The problem is, what does it mean that &quot;the request has failed&quot;. That could be

- the request couldn&#39;t be issued at all (eg. Connection refused and such errors), or
- the above plus the server returned an error code (eg. 404)

Also, I&#39;d like to know whether it means `onerror` and `onload` should never fire simultaneously.

[This reference][2] indicates the `onerror` handler should be executed depending on the `status` code and `onload` depending on `readyState`. That would indicate they are not mutually exclusive, however, I don&#39;t think this is an authoritative information.

I&#39;m asking because using the latest Opera snapshot, I found `onload` is fired even on 404 status code. I know testing `status` is a sure bet, but I&#39;d like to know whether it&#39;s something I have to do per specification or just a workaround for a bug in Opera.


  [1]: http://www.w3.org/TR/XMLHttpRequest/#event-xhr-error
  [2]: http://www.javascriptkit.com/jsref/ajax.shtml

When should XMLHttpRequest&#39;s onerror handler fire

I have a little problem understanding <code>XMLHttpRequest</code>'s handlers. <a href="http://www.w3.org/TR/XMLHttpRequest/#event-xhr-error" target="_blank" rel="noopener noreferrer">The specification says this about the <code>onerror</code> handler</a>:
> <code>error</code> [Dispatched ... ] When the request has failed.
>
> <code>load</code> [Dispatched ... ] When the request has successfully completed.
The problem is, what does it mean that "the request has failed". That could be
<ul>
<li>the request couldn't be issued at all (eg. Connection refused and such errors), or</li>
<li>the above plus the server returned an error code (eg. 404)</li>
</ul>
Also, I'd like to know whether it means <code>onerror</code> and <code>onload</code> should never fire simultaneously.
<a href="http://www.javascriptkit.com/jsref/ajax.shtml" target="_blank" rel="noopener noreferrer">This reference</a> indicates the <code>onerror</code> handler should be executed depending on the <code>status</code> code and <code>onload</code> depending on <code>readyState</code>. That would indicate they are not mutually exclusive, however, I don't think this is an authoritative information.
I'm asking because using the latest Opera snapshot, I found <code>onload</code> is fired even on 404 status code. I know testing <code>status</code> is a sure bet, but I'd like to know whether it's something I have to do per specification or just a workaround for a bug in Opera.

I want to parse a string which contains HTML text. I want to do it in JavaScript.

I tried the [Pure JavaScript HTML Parser library](https://johnresig.com/blog/pure-javascript-html-parser/) but it seems that it parses the HTML of my current page, not from a string. Because when I try the code below, it changes the title of my page:

    var parser = new HTMLtoDOM(&quot;&lt;html&gt;&lt;head&gt;&lt;title&gt;titleTest&lt;/title&gt;&lt;/head&gt;&lt;body&gt;&lt;a href=&#39;test0&#39;&gt;test01&lt;/a&gt;&lt;a href=&#39;test1&#39;&gt;test02&lt;/a&gt;&lt;a href=&#39;test2&#39;&gt;test03&lt;/a&gt;&lt;/body&gt;&lt;/html&gt;&quot;, document);

My goal is to extract links from an HTML external page that I read just like a string.

Do you know an API to do it?

Parse an HTML string with JS

I keep reading about ping/pong messages in websockets to keep the connection alive, but I&#39;m not sure what they are.  Is it a distinct frame type? (I don&#39;t see any methods on a javascript WebSocket object in chrome related to ping-pong).  Or is it just a design pattern (e.g. I literally send &quot;ping&quot; or any other string to the server and have it respond).  Is ping-pong at all related to continuation frames?

The reason I ask is I&#39;m using a python framework that runs behind Mongrel2, so I&#39;m wondering if there&#39;s a way to send Mongrel2 a specific ping/pong message that would tell it to keep the connection alive without my python app needing to worry about it.  Analogous to a having a separate HTTP method for it, I guess.  And I imagine a dedicated ping/pong message frame could be simpler (less load on server and network) than the string &quot;ping&quot;, though that probably wouldn&#39;t matter too much.

EDIT: I just looked at [RFC 6455][1] and it looks like Ping and Pong are definitely control frame types with their own opcodes.  So how do I send a Ping frame from javascript in Chrome?


  [1]: https://www.rfc-editor.org/rfc/rfc6455#section-5.5.2

Sending websocket ping/pong frame from browser

Currently using Chrome v19.0.1084.46 (Official Build 135956) beta-m
jqGrid 4.3.2 (latest release)

The problem is that no matter the size of my grid, columns, or containing div, a small fraction of my last column gets pushed beyond the edge of the grid, causing horizontal scroll bars to appear, which should not happen. See below:

![grid][1]

I&#39;ve been fiddling with the following attributes on jqGrid to try and fix this:

* `width`
* `autowidth`
* `height`
* `shrinkToFit`
* `scrollOffset` - Had the best luck with this one, but nothing repeatable.

I&#39;ve also stripped down to the basic grid css only, thinking it might have been a rule I put in place...with no luck.

Has anyone else experienced this and/or found a solution to this? Help is much appreciated.


  [1]: http://i.stack.imgur.com/q5hzk.jpg

jqGrid does not render correctly in Chrome/Chrome Frame

&gt; **Possible Duplicate:**  
&gt; [Detecting an &amp;ldquo;invalid date&amp;rdquo; Date instance in JavaScript](https://stackoverflow.com/questions/1353684/detecting-an-invalid-date-date-instance-in-javascript)  

&lt;!-- End of automatically inserted text --&gt;

Is there is a function `IsDate()` in javascript?

Checking if a date is valid in javascript

I have a piece of JavaScript code which creates (using D3.js) an `svg` element which contains a chart. I want to update the chart based on new data coming from a web service using AJAX, the problem is that each time I click on the update button, it generates a new `svg`, so I want to remove the old one or update its content.

Here is a snippet from the JavaScript function where I create the `svg`:

    var svg = d3.select(&quot;body&quot;)
			.append(&quot;svg&quot;)
			.attr(&quot;width&quot;, w)
			.attr(&quot;height&quot;, h);

How can I remove the old `svg` element or at least replace its content?


How can I remove or replace SVG content?

    function (data) {
        //add values based on activity type
        //data = JSON.parse(data);
        //alert(abc.Phone1);
                 
        alert(data.myName)
                
        alert(data.toString());
        if (activityType == &quot;Phone&quot;) {
        }
        return;

    },

As you can see this callback function of `$.ajax` taking `JSON` data from controller.

For example:

`[{&quot;name&quot;:&quot;myName&quot; ,&quot;address&quot;: &quot;myAddress&quot; }]` 

In this case my first alert giving me undefined and second/third alert popup comes up with:

`[{&quot;name&quot;:&quot;myName&quot; ,&quot;address&quot;: &quot;myAddress&quot; }]`

How can I access value by name so that my first alert filled out with `myName` which is value of `name`? 

How to access JSON Object name/value?

I&#39;m using jQuery and Ajax for my forms to submit data and files but I&#39;m not sure how to send both data and files in one form?

I currently do almost the same with both methods but the way in which the data is gathered into an array is different, the data uses `.serialize();` but the files use `= new FormData($(this)[0]);`

Is it possible to combine both methods to be able to upload files and data in one form through Ajax?

**Data jQuery, Ajax and html**

    $(&quot;form#data&quot;).submit(function(){
		
        var formData = $(this).serialize();

        $.ajax({
            url: window.location.pathname,
            type: &#39;POST&#39;,
            data: formData,
            async: false,
            success: function (data) {
				alert(data)
            },
            cache: false,
            contentType: false,
            processData: false
        });
        
        return false;
    });

    &lt;form id=&quot;data&quot; method=&quot;post&quot;&gt;
        &lt;input type=&quot;text&quot; name=&quot;first&quot; value=&quot;Bob&quot; /&gt;
        &lt;input type=&quot;text&quot; name=&quot;middle&quot; value=&quot;James&quot; /&gt;
        &lt;input type=&quot;text&quot; name=&quot;last&quot; value=&quot;Smith&quot; /&gt;
        &lt;button&gt;Submit&lt;/button&gt;
    &lt;/form&gt;

**Files jQuery, Ajax and html**

    $(&quot;form#files&quot;).submit(function(){
		
        var formData = new FormData($(this)[0]);

        $.ajax({
            url: window.location.pathname,
            type: &#39;POST&#39;,
            data: formData,
            async: false,
            success: function (data) {
				alert(data)
            },
            cache: false,
            contentType: false,
            processData: false
        });
        
        return false;
    });

    &lt;form id=&quot;files&quot; method=&quot;post&quot; enctype=&quot;multipart/form-data&quot;&gt;
        &lt;input name=&quot;image&quot; type=&quot;file&quot; /&gt;
        &lt;button&gt;Submit&lt;/button&gt;
    &lt;/form&gt;

How can I combine the above so that I can send data and files in one form via Ajax?

My aim is to be able to send all of this form in one post with Ajax, is it possible?

    &lt;form id=&quot;datafiles&quot; method=&quot;post&quot; enctype=&quot;multipart/form-data&quot;&gt;
        &lt;input type=&quot;text&quot; name=&quot;first&quot; value=&quot;Bob&quot; /&gt;
        &lt;input type=&quot;text&quot; name=&quot;middle&quot; value=&quot;James&quot; /&gt;
        &lt;input type=&quot;text&quot; name=&quot;last&quot; value=&quot;Smith&quot; /&gt;
        &lt;input name=&quot;image&quot; type=&quot;file&quot; /&gt;
        &lt;button&gt;Submit&lt;/button&gt;
    &lt;/form&gt;



Uploading both data and files in one form using Ajax?

How do you make JS think that a string is JSON ?

I have a function which only works if JSON object is passed to it. If I pass a string to it, with same format as JSON, it doesn&#39;t work. So I want to make that function think that the string passed to it is a JSON. The string is indeed in the JSON format.

I also tried the following. I inputted the string through Ajax , with &quot;handle as&quot; parameter as &quot;JSON&quot;, and then when  I passed the result to the function it works.

So I deduced the problem is not with the string. How do I convert this string to JSON? If i get same string through ajax request and then passing it to function works, whereas directly passing it doesn&#39;t work. 

The string is as follows:

      {
         &quot;data&quot;: [
       {
      &quot;id&quot;: &quot;id1&quot;,
          &quot;fields&quot;: [
            {
              &quot;id&quot;: &quot;name1&quot;,
              &quot;label&quot;: &quot;joker&quot;,
              &quot;unit&quot;: &quot;year&quot;
            },
             {&quot;id&quot;: &quot;name2&quot;, &quot;label&quot;: &quot;Quantity&quot;},
    	],
          &quot;rows&quot;: [    data here....
    
    and closing braces..


Converting a string to JSON object

I have two select elements, A and B: when A&#39;s selected option changes, B&#39;s options must be updated accordingly. Each element in A implies many elements in B, it&#39;s a one-to-many relationship (A contains nations, B should contain cities located in the given nation).

The function `do_ajax` should run the asynchronous request:

    function do_ajax(elem, mydata, filename)
    {
        $.ajax({
            url: filename,
            context: elem,
            data: mydata,
            datatype: &quot;html&quot;,
            success: function (data, textStatus, xhr) {
                elem.innerHTML = data;
            }
        });
    }

In order to update B&#39;s options I&#39;ve added a function call in A&#39;s `onChange` event. Here is the function that runs when onChange event (of `A`) is triggered:

    function my_onchange(e) // &quot;e&quot; is element &quot;A&quot;
    {
        var sel_B = ... ; // get select element &quot;B&quot;

        // I skipped some code here
        // ...

        var data = {
            &#39;mode&#39;: &#39;filter_city&#39;,
            &#39;id_A&#39;: e[e.selectedIndex]
        };
        do_ajax(city_sel, data, &#39;ajax_handler.php&#39;);
    }
}


I&#39;ve read in [JQuery docs](http://api.jquery.com/jQuery.ajax/) that `data` can be an array (key value pairs). I get the error if I put:

    var data = {
            &#39;mode&#39;: &#39;filter_city&#39;,
            &#39;id_A&#39;: e[e.selectedIndex]
    };

Instead, I don&#39;t get that error if my data is a string:

    var data = &#39;mode=filter_city&amp;amp;id_A=&#39; + e[e.selectedIndex];

But I need the &quot;array version&quot; of the variable, in my server-side php code. 

The `Uncaught TypeError: Illegal invocation` is located in the &quot;jquery-1.7.2.min.js&quot; file, which is all compressed, so I couldn&#39;t figure out what part of code raised the error.

Is there any setting I can change in my code so that it accepts data as an associative array?

JQuery: &#39;Uncaught TypeError: Illegal invocation&#39; at ajax request - several elements

I am stuck with this CORS problem, even though I set the server (nginx/node.js) with the appropriate headers.

I can see in Chrome Network pane -&gt; Response Headers:

    Access-Control-Allow-Origin:http://localhost

which should do the trick.

Here&#39;s the code that I now use to test:

    var xhr = new XMLHttpRequest();
    xhr.onload = function() {
       console.log(&#39;xhr loaded&#39;);
    };
    xhr.open(&#39;GET&#39;, &#39;http://stackoverflow.com/&#39;);
    xhr.send();

I get

&gt; XMLHttpRequest cannot load http://stackoverflow.com/. Origin http://localhost is not allowed by Access-Control-Allow-Origin.

I suspect it&#39;s a problem in the client script and not server configuration...


Why does my http://localhost CORS origin not work?

I want to send a few variables and a string with the `POST` method from JavaScript. 

I get the string from the database, and then send it to a PHP page. I am using an `XMLHttpRequest` object.

The problem is that the string contains the character `&amp;` a few times, and the `$_POST` array in PHP sees it like multiple keys.

I tried replacing the `&amp;` with `\&amp;` with the `replace()` function, but it doesn&#39;t seem to do anything.

Can anyone help?

**The javascript code and the string looks like this:**

    var wysiwyg = dijit.byId(&quot;wysiwyg&quot;).get(&quot;value&quot;);
	var wysiwyg_clean = wysiwyg.replace(&#39;&amp;&#39;,&#39;\&amp;&#39;);

	var poststr = &quot;act=save&quot;;

	poststr+=&quot;&amp;titlu=&quot;+frm.value.titlu;
	poststr+=&quot;&amp;sectiune=&quot;+frm.value.sectiune;
	poststr+=&quot;&amp;wysiwyg=&quot;+wysiwyg_clean;
	poststr+=&quot;&amp;id_text=&quot;+frm.value.id_text;

	xmlhttp.open(&quot;POST&quot;,&quot;lista_ajax.php&quot;,true);
	xmlhttp.setRequestHeader(&quot;Content-type&quot;,&quot;application/x-www-form-urlencoded&quot;);
	xmlhttp.send(poststr);


**The String is:**

     &lt;span class=&quot;style2&quot;&gt;&amp;quot;Busola&amp;quot;&lt;/span&gt;

How can I send the &quot;&amp;&quot; (ampersand) character via AJAX?

I always wonder why this object is called like that?

The body of your request does not need to be in XML format. Also, data received from server can be fetched as JSON, XML, HTML, or plain text. XML does not play an essential part in this object. Is this some kind of a clich&#233;? What is this object used to be when it was first created?

Why is it called XMLHttpRequest?

I recently ran into with posting Javascript requests to another domain.  By default XHR  posting to other domains is not allowed.

Following the instructions from http://enable-cors.org/, I enabled this on the other domain.

    &lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?&gt;
    &lt;configuration&gt;
     &lt;system.webServer&gt;
      &lt;httpProtocol&gt;
        &lt;customHeaders&gt;
          &lt;add name=&quot;Access-Control-Allow-Origin&quot; value=&quot;*&quot; /&gt;
          &lt;add name=&quot;Access-Control-Allow-Methods&quot; value=&quot;GET,PUT,POST,DELETE,OPTIONS&quot; /&gt;
          &lt;add name=&quot;Access-Control-Allow-Headers&quot; value=&quot;Content-Type&quot; /&gt;
        &lt;/customHeaders&gt;
      &lt;/httpProtocol&gt;
     &lt;/system.webServer&gt;
    &lt;/configuration&gt;

![enter image description here][1]

Everything works fine now, however it is still return a 405 response before sending back the working 200 response.


  [1]: http://i.stack.imgur.com/xmx7u.png

    Request URL:http://testapi.nottherealsite.com/api/Reporting/RunReport
    Request Method:OPTIONS
    Status Code:405 Method Not Allowed
    Request Headersview source
    Accept:*/*
    Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3
    Accept-Encoding:gzip,deflate,sdch
    Accept-Language:en-GB,en-US;q=0.8,en;q=0.6
    Access-Control-Request-Headers:origin, content-type, accept
    Access-Control-Request-Method:POST
    Connection:keep-alive
    Host:testapi.nottherealsite.com
    Origin:http://test.nottherealsite.com
    Referer:http://test.nottherealsite.com/Reporting
    User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.1 (KHTML, like Gecko) Chrome/21.0.1180.89 Safari/537.1
    Response Headersview source
    Access-Control-Allow-Headers:Content-Type
    Access-Control-Allow-Methods:GET,PUT,POST,DELETE,OPTIONS
    Access-Control-Allow-Origin:*
    Allow:POST
    Cache-Control:private
    Content-Length:1565
    Content-Type:text/html; charset=utf-8
    Date:Tue, 18 Sep 2012 14:26:06 GMT
    Server:Microsoft-IIS/7.5
    X-AspNet-Version:4.0.30319
    X-Powered-By:ASP.NET


Update: 3/02/2014

There is a recently updated article in MSDN magazine. Detailing CORS Support in ASP.NET Web API 2.

http://msdn.microsoft.com/en-us/magazine/dn532203.aspx

enabling cross-origin resource sharing on IIS7


    var fd = new FormData();
    fd.append(&quot;fileToUpload&quot;, document.getElementById(&#39;fileToUpload&#39;).files[0]);
    var xhr = new XMLHttpRequest();
    xhr.open(&quot;POST&quot;, &quot;uph.php&quot;);
    xhr.send(fd);

uph.php:

    var_dump($_FILES[&#39;fileToUpload&#39;]);

This works, but obviously for the `files[0]` only. How to get this working for chosen file?

I tried removing the `[0]`, but it didn&#39;t work.

Content Type	Original Author	Original Content on Stackoverflow
Question	jpalecek	View Question on Stackoverflow
Solution 1 - Javascript	apsillers	View Answer on Stackoverflow
Solution 2 - Javascript	StanE	View Answer on Stackoverflow

When should XMLHttpRequest's onerror handler fire

Javascript Problem Overview

Javascript Solutions

Solution 1 - Javascript

Solution 2 - Javascript

Can I use viewDidLoad method in UITableviewCell?

Is it possible to stop requireJS from adding the .js file extension automatically?

Attributions