Answers.Body: <p>I've managed to do this with:</p>
  
  <pre><code>&lt;form method="post" accept-charset="UTF-8"&gt;
      {{ csrfInput() }}
      &lt;input type="hidden" name="action" value="users/save-user"&gt;
      &lt;input type="hidden" name="userId" value="{{ currentUser.id }}"&gt;
      {% include '_partial/wish-list-fields' %}
  
      &lt;input type="hidden" name="fields[userWishListMatrix][{{ block.id }}][type]" value="null"&gt;
  
      &lt;input type="submit" value="Remove"&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>The <code>wish-list-fields</code> partial include hidden inputs showing all the fields already there. e.g.:</p>
  
  <pre><code>&lt;input type="hidden" name="fields[userWishListMatrix][{{ block.id }}][fields][itemProperties][0][col1]" value="{{ row.property }}"&gt;
  </code></pre>
  
  <p>It repeats itself which I know doesn't seem terribly efficient but i dunno :-/ It works!</p>
  
  <p>Please note, I'm on <a href="/questions/tagged/craft3" class="post-tag" title="show questions tagged &#39;craft3&#39;" rel="tag">craft3</a> so things may be a little different (although most likely just the <code>save-user</code> / <code>saveUser</code> action).</p>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2018-04-12T08:42:52.063Z
Answers.LastActivityDate: 2018-04-12T08:42:52.063Z
Answers.UserDisplayName: ianp
Answers.Body: <p>You can just add each matrix row data inside a  wrapper with an ID of matrix row:</p>
  
  <pre><code>&lt;form id="some-custom-form" method="post" accept-charset="UTF-8" enctype="multipart/form-data"&gt;
      {{ csrfInput() }}
      {{ redirectInput('/where-you-need') }}
      {{ actionInput('users/save-user') }}
      {{ hiddenInput('userId', currentUser.id) }}
  
      {% for block in currentUser.anyMatrixFieldName%}
  </code></pre>
  
  <p>here the  wrapper with a matrix row id attribute:</p>
  
  <pre><code>&lt;div id="{{ block.id}}"&gt;
          &lt;input type="hidden" name="fields[anyMatrixFieldName][{{ block.id}}][type]" value="item"&gt;
          &lt;input type="hidden" name="fields[anyMatrixFieldName][{{ block.id}}][enabled]" value="1"&gt;
          &lt;input type="hidden" name="fields[anyMatrixFieldName][{{ block.id }}][fields][time][time]" value="{{ block.time|date('H:i') }}"&gt;
  &lt;/div&gt;
  
          &lt;a href="#" class="matrix-remove" data-matrix="{{ block.id }}"&gt;Remove&lt;/a&gt;
  {% endfor %}
  &lt;/form&gt;
  </code></pre>
  
  <p>Then jQuery code which will remove matrix row and will submit the form:</p>
  
  <pre><code>    {% js at endBody %}
      $('.matrix-remove').click(function(event) {
        event.preventDefault();
        var matrixBlockId = '#' + $(this).attr('data-matrix');
        $(matrixBlockId).remove();
        $('#some-custom-form').submit();
      });
      {% endjs %}
  </code></pre>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2020-04-18T13:13:27.193Z
Answers.LastActivityDate: 2020-04-18T13:13:27.193Z
Answers.UserDisplayName: Nikolay Bronskiy
Answers.Body: <p>Thanks to @ianp's answer, I was able to get the code below working.</p>
  <p>This code deletes a single block entry from a matrix field through a front-end form. It's important to include the <code>[sortOrder]</code> array field in the form submission. This is how Craft knows which block entry to update/delete.</p>
  <p><a href="https://craftcms.com/docs/4.x/matrix-fields.html#saving-matrix-fields" rel="nofollow noreferrer">This Craft doc page</a> is also very helpful when dealing with saving a front-end matrix field in general.</p>
  <pre><code>{% for block in currentUser.matrixFieldName.all() %}
  
   &lt;form method=&quot;post&quot; accept-charset=&quot;UTF-8&quot;&gt;
    {{ csrfInput() }}
    {{ actionInput('users/save-user') }}
    {{ hiddenInput('userId', currentUser.id) }}
    {{ redirectInput(&quot;/account&quot;) }}
    {{ hiddenInput('fields[matrixFieldName][sortOrder][]', block.id) }}
    {{ hiddenInput('fields[matrixFieldName][block.id][type]', null) }}
  
    &lt;input type=&quot;submit&quot; value=&quot;Remove&quot; /&gt;
   &lt;/form&gt;
  
  {% endfor %}
  </code></pre>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2022-10-27T19:26:55.693Z
Answers.LastActivityDate: 2022-10-28T19:06:55.947Z
Answers.LastEditDate: 2022-10-28T19:06:55.947Z
Answers.UserDisplayName: comtyler
Body: <p>I created a user profile page with Matrix field with assets, I found <a href="https://craftcms.stackexchange.com/questions/1318/how-to-get-matrix-editor-into-frontend/1322#1322">this thread</a> and <a href="https://craftcms.stackexchange.com/questions/6551/how-to-update-matrix-field-on-frontend-for-user-profile">this thread</a> about adding and updating Matrix field in the frontend. Does anyone know how to delete the Matrix field? Moreover, I found that if I update Matrix field through the front end, it doesn't update the S3 bucket. Files are still stored in S3. Does anyone has a solution or give me a hint on delete/modify Matrix asset field? Thanks </p>
  
Comments.ContentLicense: CC BY-SA 3.0
Comments.CreationDate: 2017-05-16T15:44:02.440Z
Comments.Text: Found [this thread](https://craftcms.stackexchange.com/questions/2013/how-do-you-delete-assets-from-a-frontend-form) about delete matrix is very useful.
Comments.UserDisplayName: Angela Chan
Tags: <assets><matrix>
Title: How to delete Matrix fields in front end
ThreadText: # How to delete Matrix fields in front end
  
  (Asked by: username_0 on 2017-05-05)
  
  I created a user profile page with Matrix field with assets, I found [this thread](https://craftcms.stackexchange.com/questions/1318/how-to-get-matrix-editor-into-frontend/1322#1322) and [this thread](https://craftcms.stackexchange.com/questions/6551/how-to-update-matrix-field-on-frontend-for-user-profile) about adding and updating Matrix field in the frontend. Does anyone know how to delete the Matrix field? Moreover, I found that if I update Matrix field through the front end, it doesn't update the S3 bucket. Files are still stored in S3. Does anyone has a solution or give me a hint on delete/modify Matrix asset field? Thanks
  
  **Tags:** assets, matrix
  
  > **Comments:**
  > **username_0**: Found [this thread](https://craftcms.stackexchange.com/questions/2013/how-do-you-delete-assets-from-a-frontend-form) about delete matrix is very useful.  
  
  ---
  
  ## 3 answers
  
  ### Answer by username_1 on 2018-04-12. Score: 2
  
  I've managed to do this with:
  
  ```
  <form method="post" accept-charset="UTF-8">
      {{ csrfInput() }}
      <input type="hidden" name="action" value="users/save-user">
      <input type="hidden" name="userId" value="{{ currentUser.id }}">
      {% include '_partial/wish-list-fields' %}
  
      <input type="hidden" name="fields[userWishListMatrix][{{ block.id }}][type]" value="null">
  
      <input type="submit" value="Remove">
  </form>
  
  ```
  
  The `wish-list-fields` partial include hidden inputs showing all the fields already there. e.g.:
  
  ```
  <input type="hidden" name="fields[userWishListMatrix][{{ block.id }}][fields][itemProperties][0][col1]" value="{{ row.property }}">
  
  ```
  
  It repeats itself which I know doesn't seem terribly efficient but i dunno :-/ It works!
  
  Please note, I'm on [craft3](/questions/tagged/craft3 "show questions tagged 'craft3'") so things may be a little different (although most likely just the `save-user` / `saveUser` action).
  
  
  ---
  
  ### Answer by username_2 on 2020-04-18. Score: 1
  
  You can just add each matrix row data inside a wrapper with an ID of matrix row:
  
  ```
  <form id="some-custom-form" method="post" accept-charset="UTF-8" enctype="multipart/form-data">
      {{ csrfInput() }}
      {{ redirectInput('/where-you-need') }}
      {{ actionInput('users/save-user') }}
      {{ hiddenInput('userId', currentUser.id) }}
  
      {% for block in currentUser.anyMatrixFieldName%}
  
  ```
  
  here the wrapper with a matrix row id attribute:
  
  ```
  <div id="{{ block.id}}">
          <input type="hidden" name="fields[anyMatrixFieldName][{{ block.id}}][type]" value="item">
          <input type="hidden" name="fields[anyMatrixFieldName][{{ block.id}}][enabled]" value="1">
          <input type="hidden" name="fields[anyMatrixFieldName][{{ block.id }}][fields][time][time]" value="{{ block.time|date('H:i') }}">
  </div>
  
          <a href="#" class="matrix-remove" data-matrix="{{ block.id }}">Remove</a>
  {% endfor %}
  </form>
  
  ```
  
  Then jQuery code which will remove matrix row and will submit the form:
  
  ```
      {% js at endBody %}
      $('.matrix-remove').click(function(event) {
        event.preventDefault();
        var matrixBlockId = '#' + $(this).attr('data-matrix');
        $(matrixBlockId).remove();
        $('#some-custom-form').submit();
      });
      {% endjs %}
  
  ```
  
  
  ---
  
  ### Answer by username_3 on 2022-10-27. Score: 0
  
  Thanks to @username_1's answer, I was able to get the code below working.
  
  This code deletes a single block entry from a matrix field through a front-end form. It's important to include the `[sortOrder]` array field in the form submission. This is how Craft knows which block entry to update/delete.
  
  [This Craft doc page](https://craftcms.com/docs/4.x/matrix-fields.html#saving-matrix-fields) is also very helpful when dealing with saving a front-end matrix field in general.
  
  ```
  {% for block in currentUser.matrixFieldName.all() %}
  
   <form method="post" accept-charset="UTF-8">
    {{ csrfInput() }}
    {{ actionInput('users/save-user') }}
    {{ hiddenInput('userId', currentUser.id) }}
    {{ redirectInput("/account") }}
    {{ hiddenInput('fields[matrixFieldName][sortOrder][]', block.id) }}
    {{ hiddenInput('fields[matrixFieldName][block.id][type]', null) }}
  
    <input type="submit" value="Remove" />
   </form>
  
  {% endfor %}
  
  ```
  
  
  ---
  
  