CODEWITHSUNDEEP
javaspringwebthymeleaf
abc
abc

Reputation: 512

Thymeleaf - delete with confirme modal

I want to delete the object from table. The problem is that I do not delete the object I click. I always delete the object above. what am I doing wrong?

home.html

<tr th:each="fgp : ${fingerprints}">
    <td><a th:href="@{'/home/'+${fgp.fingerprintId}+'/viewFingerprints'}"><button
                        type="button" class="btn btn-success">V</button></a> <a
                th:href="@{'/home/'+${fgp.fingerprintId}+'/editFingerprints'}"><button
                        type="button" class="btn btn-warning">E</button></a>

                <button type="button" class="btn btn-danger" data-toggle="modal"
                    data-target="#myModal"></button>

                <!-- The Modal -->
                <div class="modal fade" id="myModal">
                    <div class="modal-dialog">
                        <div class="modal-content">

                            <!-- Modal Header -->
                            <div class="modal-header">
                                <h4 class="modal-title">Are you sure?</h4>
                                <button type="button" class="close" data-dismiss="modal">&times;</button>
                            </div>

                            <!-- Modal footer -->
                            <div class="modal-footer">
                                <button type="button" class="btn btn-danger"
                                    data-dismiss="modal">Close</button>
                                <a th:href="@{'/home/'+${fgp.fingerprintId}+'/deleteFingerprints'}"><button
                                        type="button" class="btn btn-success">Yes</button></a>
                            </div>
                        </div>
                    </div>
                </div>
            </td>

Controller

@GetMapping("/home/{fingerprintId}/deleteFingerprints")
public String deleteFingerprints(@PathVariable("fingerprintId") int id, Model model) {

    Fingerprints fingerprint = fingerprintRepository.findByFingerprintId(id);

    System.out.println("Fingerprint id: " + fingerprint.getFingerprintId());

    fingerprintRepository.delete(fingerprint);

    return "redirect:/home";
}

Upvotes: 4

Views: 7245

Answers (3)

Facundo Gonzalez
Facundo Gonzalez

Reputation: 11

                <td sec:authorize="hasRole('ROLE_ADMIN')">
                    <button class="btn btn-outline-danger" 
                    data-toggle="modal"  th:attr="data-target='#recordDeleteModal'+${persona.id}"><i class="far fa-trash-alt " 
                     ></i></button>
                            
                         <!-- The Modal -->
                    <div class="modal fade" th:attr="id='recordDeleteModal'+${persona.id}"> 
                        <div class="modal-dialog">
                            <div class="modal-content">
    
                                <!-- Modal Header -->
                                <div class="modal-header">
                                    <h4 class="modal-title">Are you sure?</h4>
                                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                                </div>
    
                                <!-- Modal footer -->
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-danger"
                                        data-dismiss="modal">Close</button>
                                    <a  th:attr="href='/persona/borrar/'+${persona.id}"><button
                                            type="button" class="btn btn-success">Yes</button></a>
                                </div>
                            </div>
                        </div>
                    </div>      
                        
                            
                </td>

Upvotes: 1

Selva
Selva

Reputation: 41

<tr th:each="record : ${recordList}" >              
    <td>
    <button type="button" class="btn btn-outline-light text-dark" data-toggle="modal" th:attr="data-target='#recordDeleteModal'+${record.id}">Delete</button>

     <!-- Modal -->
        <div class="modal fade" th:attr="id='recordDeleteModal'+${record.id}" tabindex="-1" role="dialog" aria-labelledby="recordDeleteModalLabel" aria-hidden="true">
          <div class="modal-dialog" role="document">
            <div class="modal-content">
              <div class="modal-header">
                <h5 class="modal-title" id="recordDeleteModalLabel">Delete Record</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                  <span aria-hidden="true">&times;</span>
                </button>
              </div>
              <div class="modal-body">
                Are you sure you want to delete this record?
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">No</button>
                <a href="newRecordForm.html" class="btn btn-primary" th:attr="href='/record/'+${record.id}+'/deleteRecord'">Yes</a>
              </div>
            </div>
          </div>
        </div>
        <!-- Modal end --> 

    </td>

Upvotes: 4

abc
abc

Reputation: 512

I found the error: I replaced with:

th:attr="data-target='#myModal'+${fgp.fingerprintId}">D</button>

and with 

th:attr="id='/home/'+${fgp.fingerprintId}+'/deleteFingerprints'">

Upvotes: 0

Related Questions