xhr request javascript

var url = "https://example.com/";

var xhr = new XMLHttpRequest();
xhr.open("GET", url);

xhr.onreadystatechange = function () {
   if (xhr.readyState === 4) {
      console.log(xhr.status);
      console.log(xhr.responseText);
   }};

xhr.send();

View another examples Add Own solution

3.6

Awgiedawgie 440215 points

                                    function httpGetAsync(url, callback) {
  var xmlHttp = new XMLHttpRequest();
  xmlHttp.onreadystatechange = function() { 
    if (xmlHttp.readyState == 4 &amp;&amp; xmlHttp.status == 200)
      callback(xmlHttp.responseText);
  }
  xmlHttp.open(&quot;GET&quot;, url, true); // true for asynchronous 
  xmlHttp.send(null);
}

Thank you! 11

3.6 (10 Votes)

4.1

Awgiedawgie 440215 points

                                    var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (this.readyState == 4 &amp;&amp; this.status == 200) {
       // Typical action to be performed when the document is ready:
       document.getElementById(&quot;demo&quot;).innerHTML = xhttp.responseText;
    }
};
xhttp.open(&quot;GET&quot;, &quot;filename&quot;, true);
xhttp.send();

Thank you! 10

4.1 (10 Votes)

4.5

Awgiedawgie 440215 points

                                    window.onload = function(){
    var request = new XMLHttpRequest();
    var params = &quot;UID=CORS&amp;name=CORS&quot;;

    request.onreadystatechange = function() {
        if (this.readyState == 4 &amp;&amp; this.status == 200) {
            console.log(this.responseText);
        }
    };

    request.open('POST', 'https://www.example.com/api/createUser', true);
    request.setRequestHeader('api-key', 'your-api-key');
    request.setRequestHeader(&quot;Content-type&quot;, &quot;application/x-www-form-urlencoded&quot;);
    request.send(params);
}

Thank you! 10

4.5 (10 Votes)

Phoenix Logan 186120 points

                                    function reqListener () {
  console.log(this.responseText);
}

var oReq = new XMLHttpRequest();
oReq.onload = reqListener;
oReq.open(&quot;GET&quot;, &quot;http://www.example.org/example.txt&quot;);
oReq.send();

Thank you! 0

Awgiedawgie 440215 points

                                    &lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;body&gt;
&lt;p id=&quot;demo&quot;&gt;result&lt;/p&gt;
&lt;button type=&quot;button&quot; onclick=&quot;get_post_ajax();&quot;&gt;Change Content&lt;/button&gt;
&lt;script type=&quot;text/javascript&quot;&gt;
	function update_progress(e)
	{
	  if (e.lengthComputable)
	  {
	    var percentage = Math.round((e.loaded/e.total)*100);
	    console.log(&quot;percent &quot; + percentage + '%' );
	  }
	  else 
	  {
	  	console.log(&quot;Unable to compute progress information since the total size is unknown&quot;);
	  }
	}
	function transfer_complete(e){console.log(&quot;The transfer is complete.&quot;);}
	function transfer_failed(e){console.log(&quot;An error occurred while transferring the file.&quot;);}
	function transfer_canceled(e){console.log(&quot;The transfer has been canceled by the user.&quot;);}
	function get_post_ajax()
	{
	  	var xhttp;
	  	if (window.XMLHttpRequest){xhttp = new XMLHttpRequest();}//code for modern browsers} 
	 	else{xhttp = new ActiveXObject(&quot;Microsoft.XMLHTTP&quot;);}// code for IE6, IE5	  	
	  	xhttp.onprogress = update_progress;
		xhttp.addEventListener(&quot;load&quot;, transfer_complete, false);
		xhttp.addEventListener(&quot;error&quot;, transfer_failed, false);
		xhttp.addEventListener(&quot;abort&quot;, transfer_canceled, false);	  	
	  	xhttp.onreadystatechange = function()
	  	{
	    	if (xhttp.readyState == 4 &amp;&amp; xhttp.status == 200)
	    	{
	      		document.getElementById(&quot;demo&quot;).innerHTML = xhttp.responseText;
	    	}
	  	};
	  xhttp.open(&quot;GET&quot;, &quot;http://it-tu.com/ajax_test.php&quot;, true);
	  xhttp.send();
	}
&lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;

Thank you! 2

5 (2 Votes)

Are there any code examples left?

Find Add Code snippet

New code examples in category PHP

PHP 2022-03-27 22:40:03 index:of curiosa 2019 mp4
PHP 2022-03-27 22:35:13 Dijkstra’s algorithm php
PHP 2022-03-27 22:35:12 get_declared_classes
PHP 2022-03-27 22:30:23 php move index of a value to first position in array
PHP 2022-03-27 22:25:01 wordpress get_date
PHP 2022-03-27 21:30:38 php shorten string with dots
PHP 2022-03-27 21:10:46 php header 500
PHP 2022-03-27 21:05:06 laravel schedule run
PHP 2022-03-27 20:25:12 Get page title, excerpt or content by id
PHP 2022-03-27 20:00:27 php convert date from dd/mm/yyyy to yyyy-mm-dd

Create a Free Account

Unlock the power of data and AI by diving into Python, ChatGPT, SQL, Power BI, and beyond.

Develop soft skills on BrainApps

Complete the IQ Test

Relative searches

xhr request javascript

Welcome Back!

Create a Free Account