title: Change image without reload using php and ajax
body: <p>I am trying to write the code to let users upload their profile picture using php. I want the image to be updated without reloading the page. I have tried using ajax to do this.
  My ajax code is:</p>
  
  <pre><code>  function f()
    {
  
      var ajaxRequest;  // The variable that makes Ajax possible!
  
      try{
          // Opera 8.0+, Firefox, Safari
          ajaxRequest = new XMLHttpRequest();
      } catch (e){
          // Internet Explorer Browsers
          try{
              ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
          } catch (e) {
              try{
                  ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
              } catch (e){
                  // Something went wrong
                  alert("Your browser broke!");
                  return false;
              }
          }
      }
      // Create a function that will receive data sent from the server
      ajaxRequest.onreadystatechange = function(){
          if(ajaxRequest.readyState == 4){
  
                x=document.getElementById("img");  //Find the element
               x.innerHTML=ajaxRequest.responseText;  //Change the content
  
          }
      }
  
      ajaxRequest.open("POST", "Uploadimage.php", true);
      ajaxRequest.send(); 
  }
  </code></pre>
  
  <p>Uploadimage.php is the file in which uploads the image and moves it into a folder.The $_FILES has the details of the file(filename,type etc...).
  The above code is not working i.e., the image is not getting updated.Please help me how to correct this.
  Thank you.</p>