title: Django AJAX Request Fails To Send
body: <p>I'm trying to make an AJAX POST request to create a new object. I have a Tastypie API that I would like to handle the request.</p>
  
  <p>Here is my code.</p>
  
  <p>JS:</p>
  
  <pre><code>&lt;script&gt;
  $(document).ready(function (event) {
      $('#newpersonalitem').submit(function (event) {
          event.preventDefault();
          var data = {name: $('#name').val()};
          $.ajax({
              url: 'http://162.216.18.30:8000/api/v1/personalitem/'
              type: 'POST',
              contentType: 'application/json',
              data: data,
              dataType: 'json',
              processData: false,
              success: function (data) {
                  location.reload();
                  console.log(data);
              },
          });
      });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;form action="" id='newpersonalitem'&gt;
  {% csrf_token %}
  New Item: &lt;input type='text' id='name'&gt;
  &lt;input type="submit" value="submit"&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>When I submit the form the pages reloads and but the request is never sent. I have tested the API and I am able to successful make this same request from a mobile app. Any assistance would be greatly appreciated, thanks.</p>
  
  <p>UPDATE:
  I've since tried adding the recommended changes here:</p>
  
  <p><a href="https://docs.djangoproject.com/en/dev/ref/contrib/csrf/#ajax" rel="nofollow">https://docs.djangoproject.com/en/dev/ref/contrib/csrf/#ajax</a></p>
  
  <pre><code>function csrfSafeMethod(method) {
      // these HTTP methods do not require CSRF protection
      return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
  }
  $.ajaxSetup({
      crossDomain: false, // obviates need for sameOrigin test
      beforeSend: function(xhr, settings) {
          if (!csrfSafeMethod(settings.type)) {
              xhr.setRequestHeader("X-CSRFToken", csrftoken);
          }
      }
  });
  </code></pre>
  
  <p>and I added <code>{% csrf_token %}</code> in the <code>&lt;form&gt;</code>.</p>
  
  <p>Still with no luck.</p>