title: How to add CSRF_Token in Ajax call when not using a form?
body: <p>So in the past I've used forms to send information and have managed to include a csrf token into the form but this time I'm sending the information from a javascript page without a form. Im getting an error : &quot;POST <a href="http://127.0.0.1:8000/test" rel="nofollow noreferrer">http://127.0.0.1:8000/test</a> 403 (Forbidden)&quot; which is probably due to the fact that I dont have a csrf token included. However I'm not sure where and how to implement that in this case. Thanks for your time.</p>
  <p>In my item-store.html I have so irrelevant code and at the bottom I have :</p>
  <pre><code>    &lt;script src=&quot;http://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js&quot;&gt;&lt;/script&gt;
      &lt;script type=&quot;text/javascript&quot; src=&quot;staticfiles/item-store.js&quot;&gt;&lt;/script&gt;
  </code></pre>
  <p>And then here is my item-store.js file :</p>
  <pre><code>var item_mode = &quot;all&quot;;
  console.log(&quot;Connected...&quot;)
  console.log(item_mode)
  
  // Main Get Element for All items
  document.getElementById(&quot;All_Items&quot;).onclick = function() {All_Items_func()};
  
  // Sub Get Elements for Specific items
  document.getElementById(&quot;Meat_Seafood&quot;).onclick = function() {Meat_Seafood_func()};
  document.getElementById(&quot;Bakery&quot;).onclick = function() {Bakery_func()};
  document.getElementById(&quot;Fruits&quot;).onclick = function() {Fruits_func()};
  document.getElementById(&quot;Vegetables&quot;).onclick = function() {Vegetables_func()};
  document.getElementById(&quot;Dairy&quot;).onclick = function() {Dairy_func()};
  
  function All_Items_func() {
    item_mode = &quot;all&quot;;
    console.log(item_mode);
    Send_Python_Info();
  }
  
  function Meat_Seafood_func() {
    item_mode = &quot;meat&amp;seafood&quot;;
    console.log(item_mode);
    Send_Python_Info();
  }
  
  function Bakery_func() {
    item_mode = &quot;bakery&quot;;
    console.log(item_mode);
    Send_Python_Info();
  }
  
  function Fruits_func() {
    item_mode = &quot;fruits&quot;;
    console.log(item_mode);
    Send_Python_Info();
  }
  
  function Vegetables_func() {
    item_mode = &quot;vegetables&quot;;
    console.log(item_mode);
    Send_Python_Info();
  }
  
  function Dairy_func() {
    item_mode = &quot;dairy&quot;;
    console.log(item_mode);
    Send_Python_Info();
  }
  
  // Send info to Python File
  function Send_Python_Info() {
    ToSend = JSON.stringify(item_mode)
    console.log(ToSend)
    window.alert(ToSend)
    $.ajax({
      url:&quot;/test&quot;,
      type:&quot;POST&quot;,
      contentType: &quot;application/json&quot;,
      data: JSON.stringify(ToSend),
      success: function () {
        alert(&quot;Saved!&quot;);
      }
    });
  }
  </code></pre>