Answers.Body: <p>The delete action has moved to the <a href="https://github.com/craftcms/cms/blob/develop/src/controllers/ElementsController.php" rel="nofollow noreferrer">ElementsController</a> class in Craft 4, specifically:<br />
  <a href="https://github.com/craftcms/cms/blob/7d3351996c5f9f09ea59c0a712df09fc877b753f/src/controllers/ElementsController.php#L966-L1005" rel="nofollow noreferrer">https://github.com/craftcms/cms/blob/7d3351996c5f9f09ea59c0a712df09fc877b753f/src/controllers/ElementsController.php#L966-L1005</a></p>
  <p>Updating your code as follows should work.</p>
  <pre class="lang-js prettyprint-override"><code>    var data = {
          elementId: '{{entry.id}}',
          csrfTokenName: csrfTokenValue,
      };
  
      $.post('/actions/elements/delete', data, function(response) {
          console.log('clickResponse', response);
      }, 'json');
  </code></pre>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2022-07-28T15:19:23.020Z
Answers.Text: Amazing thank you! — pointed me in the right direction!
Answers.UserDisplayName: Adrian
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2022-07-28T07:09:49.480Z
Answers.LastActivityDate: 2022-07-28T07:09:49.480Z
Answers.UserDisplayName: Ben Croker
Answers.Body: <p>Thanks to @Ben and folks on Discord — here is some form code that also works:</p>
  <pre><code>&lt;form method=&quot;post&quot; accept-charset=&quot;UTF-8&quot; enctype=&quot;multipart/form-data&quot;&gt;
      {{ csrfInput() }}
      {{ actionInput('elements/delete') }}
      {{ redirectInput('/dashboard') }}
      {{ hiddenInput('elementId', entry.id) }}
      &lt;button value=&quot;delete&quot; type=&quot;submit&quot;&gt;Delete&lt;/button&gt;
  &lt;/form&gt;
  </code></pre>
  <p>Here is a version that uses JS:</p>
  <p><strong>Link to delete:</strong></p>
  <pre><code>&lt;a href=&quot;#&quot; id=&quot;delete-entry-{{entry.id}}&quot; onclick=&quot;deleteEntry('{{entry.id}}','{{entry.title}}')&quot;&gt;Delete Entry&lt;/a&gt;
  </code></pre>
  <p><strong>JS Code:</strong></p>
  <pre><code>&lt;script&gt;
      function deleteEntry(entryId,entryTitle) {
          var data = {
              elementId: entryId,
              sectionId: 1,
              {{ craft.app.config.general.csrfTokenName|e('js') }}: '{{ craft.app.request.csrfToken|e('js') }}',
          };
          let confirmAction = confirm(&quot;Are you sure you want to delete the job titled '&quot;+entryTitle+&quot;'&quot;);
          if (confirmAction) {
              $.post('actions/elements/delete', data, function(response) {
                  console.log('clickResponse', response);
                  window.location.reload();
              }, 'json')
          } else {
              //Action Canceled.          
          }
      }
  &lt;/script&gt;
  </code></pre>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2022-07-28T15:20:32.847Z
Answers.LastActivityDate: 2022-07-28T15:44:43.387Z
Answers.LastEditDate: 2022-07-28T15:44:43.387Z
Answers.UserDisplayName: Adrian
Body: <p>Hello — been reading up on how to do this and there are some posts for Craft 2, 3 — but I'm not sure what's out there works for Craft CMS 4. I am using the following JS to delete an entry. However I get an error in the console log that <code>http://website.com/actions/entries/deleteEntry can't be found</code>. What am I doing wrong?</p>
  <pre><code>&lt;script&gt;
      
  $('#delete-entry').click(function() {
      window.csrfTokenName = &quot;{{ craft.app.config.general.csrfTokenName|e('js') }}&quot;;
      window.csrfTokenValue = &quot;{{ craft.app.request.csrfToken|e('js') }}&quot;;
  
      var data = {
          entryId: '{{entry.id}}',
          csrfTokenName: csrfTokenValue,
      };
      
  
    $.post('/actions/entries/deleteEntry', data, function(response) {
        console.log('clickResponse', response);
      }, 'json');
  
  });
  &lt;/script&gt;
  </code></pre>
  
Tags: <frontend-form><craft4>
Title: Delete Entry on Front End Form (Craft CMS 4.x)
ThreadText: # Delete Entry on Front End Form (Craft CMS 4.x)
  
  (Asked by: username_0 on 2022-07-28)
  
  Hello — been reading up on how to do this and there are some posts for Craft 2, 3 — but I'm not sure what's out there works for Craft CMS 4. I am using the following JS to delete an entry. However I get an error in the console log that `http://website.com/actions/entries/deleteEntry can't be found`. What am I doing wrong?
  
  ```
  <script>
      
  $('#delete-entry').click(function() {
      window.csrfTokenName = "{{ craft.app.config.general.csrfTokenName|e('js') }}";
      window.csrfTokenValue = "{{ craft.app.request.csrfToken|e('js') }}";
  
      var data = {
          entryId: '{{entry.id}}',
          csrfTokenName: csrfTokenValue,
      };
      
  
    $.post('/actions/entries/deleteEntry', data, function(response) {
        console.log('clickResponse', response);
      }, 'json');
  
  });
  </script>
  
  ```
  
  **Tags:** frontend-form, craft4
  
  
  ---
  
  ## 2 answers
  
  ### Answer by username_1 on 2022-07-28. Score: 2
  
  The delete action has moved to the [ElementsController](https://github.com/craftcms/cms/blob/develop/src/controllers/ElementsController.php) class in Craft 4, specifically:  
  <https://github.com/craftcms/cms/blob/7d3351996c5f9f09ea59c0a712df09fc877b753f/src/controllers/ElementsController.php#L966-L1005>
  
  Updating your code as follows should work.
  
  ```js
      var data = {
          elementId: '{{entry.id}}',
          csrfTokenName: csrfTokenValue,
      };
  
      $.post('/actions/elements/delete', data, function(response) {
          console.log('clickResponse', response);
      }, 'json');
  
  ```
  
  > **Comments:**
  > **username_0**: Amazing thank you! — pointed me in the right direction!  
  
  ---
  
  ### Answer by username_0 on 2022-07-28. Score: 2
  
  Thanks to @Ben and folks on Discord — here is some form code that also works:
  
  ```
  <form method="post" accept-charset="UTF-8" enctype="multipart/form-data">
      {{ csrfInput() }}
      {{ actionInput('elements/delete') }}
      {{ redirectInput('/dashboard') }}
      {{ hiddenInput('elementId', entry.id) }}
      <button value="delete" type="submit">Delete</button>
  </form>
  
  ```
  
  Here is a version that uses JS:
  
  **Link to delete:**
  
  ```
  <a href="#" id="delete-entry-{{entry.id}}" onclick="deleteEntry('{{entry.id}}','{{entry.title}}')">Delete Entry</a>
  
  ```
  
  **JS Code:**
  
  ```
  <script>
      function deleteEntry(entryId,entryTitle) {
          var data = {
              elementId: entryId,
              sectionId: 1,
              {{ craft.app.config.general.csrfTokenName|e('js') }}: '{{ craft.app.request.csrfToken|e('js') }}',
          };
          let confirmAction = confirm("Are you sure you want to delete the job titled '"+entryTitle+"'");
          if (confirmAction) {
              $.post('actions/elements/delete', data, function(response) {
                  console.log('clickResponse', response);
                  window.location.reload();
              }, 'json')
          } else {
              //Action Canceled.          
          }
      }
  </script>
  
  ```
  
  
  ---
  
  