Answers.Body: <p>Here's how you can pass in the CSRF token via JavaScript: <a href="http://buildwithcraft.com/help/csrf-protection#updating-your-javascript" rel="nofollow">http://buildwithcraft.com/help/csrf-protection#updating-your-javascript</a></p>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-04-17T22:54:41.530Z
Answers.Text: HOW DID I NOT FIND THIS!? Thank you!!
Answers.UserDisplayName: Damon
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-04-17T22:04:16.940Z
Answers.LastActivityDate: 2015-04-17T22:04:16.940Z
Answers.UserDisplayName: Brad Bell
Body: <p>I have been staring <a href="https://craftcms.stackexchange.com/questions/6580/how-can-i-use-csrf-protection-with-ajax-routes">at this SE post on deleting using ajax</a> and it's just not clicking.</p>
  
  <p>For example, I have a plugin with a list of users. Each user has a delete icon next to it.</p>
  
  <p><strong>template</strong></p>
  
  <pre><code>....
  &lt;td class="thin"&gt;&lt;a class="delete delete-usericon" title="Delete" role="button" data-id="{{user.id}}" data-name={{user.name}}&gt;&lt;/a&gt;&lt;/td&gt;
  ....
  </code></pre>
  
  <p>To get my javascript, I am using the <code>init</code> method in my main plugin class.</p>
  
  <p><strong>MyPlugin.php</strong></p>
  
  <pre><code>if (craft-&gt;request-&gt;isCpRequeset() &amp;&amp; craft()-&gt;userSession-&gt;isLoggedIn())
  {
      craft-&gt;template-&gt;includeJsResource('path/to/script.js');
  }
  </code></pre>
  
  <p>So far, so good.</p>
  
  <p><strong>script.js</strong></p>
  
  <pre><code>....
  $('.delete-user').click(function(event){
      var data = {
          'id': event.currentTarget.dataset.id,
          'csrfToken': // this is where i'm stuck
      };
  
      $.ajax({
          'type': 'post',
          'contentType': 'application/x-www-form-urlencoded; charset=utf-8',
          'cache': false,
          'url': 'path/to/deleteUser',
          'data': data,
          'dataType': 'json',
           'timeout': 5000
      }).done(function(status){
          console.log(status);
      }).fail(function(error){
          console.log(error);
      })
  });
  ....
  </code></pre>
  
  <p><strong>UserController.php</strong></p>
  
  <pre><code>....
  actionDeleteUser() {
      $this-&gt;requireAjaxRequest();
      error_log(__FUNCTION__); // to just test im getting this far.
  }
  </code></pre>
  
  <p>As you can imagine, I'm getting a <code>400 Bad Request The CSRF token could not be verified.</code></p>
  
  <p>I can put a hidden text field on my users "home page" using <code>{{getCsrfInput}}</code> and then grab that value no problem. </p>
  
  <p>If I log out my <code>data</code> object, I can see it's got the correct <code>id</code> and <code>csrfToken</code> but I will still get the 400. </p>
  
  <p>I'm not sure how to pass the token along with the data to the controller just yet it seems.</p>
  
  <p>Thank you for your time!</p>
  
  <p><strong>EDIT</strong></p>
  
  <p>Well, I believe I see my error, but I'm confident there is a better way (at least I think there could be)</p>
  
  <p>I wasn't passing the correct name/key.</p>
  
  <p><strong>script.js</strong></p>
  
  <pre><code>var data = {
       'id': event.currentTarget.dataset.id,
       'CRAFT_CSRF_TOKEN': $('[name="CRAFT_CSRF_TOKEN"]).val()
  }
  </code></pre>
  
  <p>I'm getting a 404 back now - great. I can figure that out. What i'm curious about is: Is there a better way?</p>
  
  <p>I've put the <code>{{getCsrfInput}}</code> on my "home" page of my plugin that lists the users. I feel like i've just done a nice hack-job on my plugin.</p>
  
Tags: <plugin-development><ajax>
Title: Delete plugin record via ajax
ThreadText: # Delete plugin record via ajax
  
  (Asked by: username_0 on 2015-04-17)
  
  I have been staring [at this SE post on deleting using ajax](https://craftcms.stackexchange.com/questions/6580/how-can-i-use-csrf-protection-with-ajax-routes) and it's just not clicking.
  
  For example, I have a plugin with a list of users. Each user has a delete icon next to it.
  
  **template**
  
  ```
  ....
  <td class="thin"><a class="delete delete-usericon" title="Delete" role="button" data-id="{{user.id}}" data-name={{user.name}}></a></td>
  ....
  
  ```
  
  To get my javascript, I am using the `init` method in my main plugin class.
  
  **MyPlugin.php**
  
  ```
  if (craft->request->isCpRequeset() && craft()->userSession->isLoggedIn())
  {
      craft->template->includeJsResource('path/to/script.js');
  }
  
  ```
  
  So far, so good.
  
  **script.js**
  
  ```
  ....
  $('.delete-user').click(function(event){
      var data = {
          'id': event.currentTarget.dataset.id,
          'csrfToken': // this is where i'm stuck
      };
  
      $.ajax({
          'type': 'post',
          'contentType': 'application/x-www-form-urlencoded; charset=utf-8',
          'cache': false,
          'url': 'path/to/deleteUser',
          'data': data,
          'dataType': 'json',
           'timeout': 5000
      }).done(function(status){
          console.log(status);
      }).fail(function(error){
          console.log(error);
      })
  });
  ....
  
  ```
  
  **UserController.php**
  
  ```
  ....
  actionDeleteUser() {
      $this->requireAjaxRequest();
      error_log(__FUNCTION__); // to just test im getting this far.
  }
  
  ```
  
  As you can imagine, I'm getting a `400 Bad Request The CSRF token could not be verified.`
  
  I can put a hidden text field on my users "home page" using `{{getCsrfInput}}` and then grab that value no problem.
  
  If I log out my `data` object, I can see it's got the correct `id` and `csrfToken` but I will still get the 400.
  
  I'm not sure how to pass the token along with the data to the controller just yet it seems.
  
  Thank you for your time!
  
  **EDIT**
  
  Well, I believe I see my error, but I'm confident there is a better way (at least I think there could be)
  
  I wasn't passing the correct name/key.
  
  **script.js**
  
  ```
  var data = {
       'id': event.currentTarget.dataset.id,
       'CRAFT_CSRF_TOKEN': $('[name="CRAFT_CSRF_TOKEN"]).val()
  }
  
  ```
  
  I'm getting a 404 back now - great. I can figure that out. What i'm curious about is: Is there a better way?
  
  I've put the `{{getCsrfInput}}` on my "home" page of my plugin that lists the users. I feel like i've just done a nice hack-job on my plugin.
  
  **Tags:** plugin-development, ajax
  
  
  ---
  
  ## 1 answers
  
  ### Answer by username_1 on 2015-04-17. Score: 3 | Accepted answer
  
  Here's how you can pass in the CSRF token via JavaScript: <http://buildwithcraft.com/help/csrf-protection#updating-your-javascript>
  
  > **Comments:**
  > **username_0**: HOW DID I NOT FIND THIS!? Thank you!!  
  
  ---
  
  