Hi everyone, in this post I want to show you on how to make a bulk delete operation with Spring Data JPA and Spring MVC. Lets have a look our goals :
As you can see in the above picture that we are going to create such a bulk delete operation, when point number 1 is describing that we will have checkbox for every single record list, and the number 2 is a button delete for delete operation.
JSP & JQuery side
Firstly we will create checkbox for every single record in view list, here is the code :
<c:forEach items="${page.objList }" var="obj" varStatus="vs"> <tr> <td> <input type="checkbox" name="bulkwelcome" class="bulkwelcome" id="bulkwelcome_${obj.id }" value="${obj.id }"/> </td> <td>${vs.count + page.startCount }</td> <td>${obj.name }</td> <td>${obj.description }</td> <td align="right"> <a href="${base }/edit/${obj.id }" class="glyphicon glyphicon-pencil" title="Edit"></a> <a href="#" onclick="deleterecord(${obj.id})" class="glyphicon glyphicon-trash" title="Delete"></a> <a href="${base }/detail/${obj.id}" class="glyphicon glyphicon-eye-open" title="Detail"></a> </td> </tr> </c:forEach>
and the second we will create one more checkbox in the top list.
<tr> <th width="3%"><input type="checkbox" name="checkall" class="checkall" id="checkall" onclick="checkall()" /></th> <th width="5%">#</th> <th>Name</th> <th>Description</th> <th width="10%"></th> </tr>
Create a new function in Javascript to check all and uncheck all when top checkbox is pressed.
/** * Check all records */ function checkall(){ var checked = $('input:checkbox[id^="bulkwelcome_"]'); if($('input.checkall').is(':checked')) { if(checked.length > 0){ $('.bulkwelcome').each(function(){ this.checked = true; }); } } else { if(checked.length > 0){ $('.bulkwelcome').each(function(){ this.checked = false; }); } } }
and now lets create a function javascript to delete records which have checked
/** * delete bulk records * * @returns {Boolean} */ function deleterecords() { var ids = $('input:checkbox:checked.bulkwelcome').map(function () { return this.value; }).get(); if(ids.length == 0){ alert("Please select at least one record"); return false; } var x = window.confirm("Are you sure to want to delete these records ?"); if (x && (ids.length > 0)) { window.location = "${base}/deletebatch/"+ids; } }
Lets call this javascript method at the button delete
<button class="btn btn-warning btn-sm glyphicon glyphicon-trash" type="button" name="delete" id="delete" onclick="deleterecords();"> <spring:message code="common.button.delete" /> </button>
Spring MVC & Spring Data JPA side
create a method in your JPA Repository class
public interface WelcomeRepository extends JpaRepository<Welcome, Long>{ // this method is similar to select * from welcome where id in (?, ?, ?) public List<Welcome> findByIdIn(Long[] id); }
Lets go to Service layer
@Override public void deleteWelcomeByIds(Long[] ids) { List<Welcome> list = welcomeRepository.findByIdIn(ids); welcomeRepository.deleteInBatch(list); }
delete in batch is a common function that already exist in Spring Data JPA
Lets have a look in Controller class
@RequestMapping(value = "${deletebatch}/{ids}", method = RequestMethod.GET) public String deleteBatchHandler(@PathVariable Long[] ids, Model model) { welcomeService.deleteWelcomeByIds(ids); return defaultHandler(model); }
Good Luck !
Please DEMO is script bos
Very descriptive article, I loved that a lot.
Will there be a part 2?