title: Worpress bad request 400 pure Javascript
body: <p>I get this following error when I use ajax in pure javascript:</p>
  
  <blockquote>
    <p>"POST <a href="http://localhost:8888/website/wp-admin/admin-ajax.php" rel="nofollow noreferrer">http://localhost:8888/website/wp-admin/admin-ajax.php</a>" 400 (Bad Request) line in code: this.xhr.send(JSON.stringify(data));</p>
  </blockquote>
  
  <p>my Contact.js file:</p>
  
  <pre><code>var Contact = function(data){
      //setups and others methods
      this.onFormSent = function(data){
  
          data = {
              action: 'my_action',
              data: data
          };
  
          if(this.ajaxSendURL !== null){
              this.xhr.open("post", this.ajaxSendURL);
              this.xhr.setRequestHeader("Content-Type", "application/json");
  
              this.xhr.onload = function() {
                  if(self.xhr.status === 200){
                      console.log(self.xhr.responseText);
                      var response = JSON.parse(self.xhr.responseText);            
                      self.onSuccessForm(data);
                  }       
              };            
              this.xhr.send(JSON.stringify(data));
          }
      };   
  };
  </code></pre>
  
  <p>I use a form tag in html after filled my "form" and pressed the submit button it should call 'my_action' in php.</p>
  
  <p>this my function.php:</p>
  
  <pre><code>function add_theme_scripts() {
      wp_enqueue_script('Contact', get_template_directory_uri() . '/js/Contact.js', array(), 1.0, true);
      wp_localize_script('Contact', 'ajaxurl', admin_url('admin-ajax.php'));
  }
  add_action('wp_enqueue_scripts', 'add_theme_scripts');
  
  /* AJAX */
  add_action('wp_ajax_my_action', 'my_action');
  add_action('wp_ajax_nopriv_my_action', 'my_action');
  
  function my_action(){
      echo 'msg from server:' + $_POST['data']['name'];
      die();
  }
  </code></pre>
  
  <p>What am I doing wrong?</p>
  
  <p>Updated: replaced by the following code and it works</p>
  
  <pre><code>this.onFormSent = function(data){
      data = "action=my_function&amp;name=" + dada.name;
      this.xhr.setRequestHeader("Content-Type", "application/json");
      ...
  }
  </code></pre>