'Removing just one Row in table - SpringBoot & Java & Thymeleaf

New to Spring-boot and Java and Thymeleaf...Trying to make it so the trash button deletes only one row in this table. Right now it if any trash button is clicked, all table rows are deleted. I ran the debugger and my controller is picking up the rowId for whichever button is clicked, so not sure why it's deleting all rows and not just the one. Any ideas?

enter image description here

//code that loads form and table (table is made up of Ams360Policies)
  @GetMapping("/directBind")
  public String getDirectBind(Model model){
        List<String> businessAgencies = new ArrayList<String>();
        businessAgencies.add("Personal");
        businessAgencies.add("Commercial");
        businessAgencies.add("Life");
        businessAgencies.add("Benefits");
        businessAgencies.add("Health");
        businessAgencies.add("Non P and C");
        model.addAttribute("businessAgencies", businessAgencies);

        DirectBind directBind = new DirectBind();

        List<Ams360Policy> ams360Policies = new ArrayList();
        Ams360Policy ams360Policy = new Ams360Policy();
        ams360Policies.add(ams360Policy);
        model.addAttribute("ams360Policies", ams360Policy);

        List<String> billTypeList = new ArrayList<String>();
        billTypeList.add("Direct Bill");
        billTypeList.add("Agency Bill");
        model.addAttribute("billTypeList", billTypeList);
        ams360Policy.setBillTypeOptions(billTypeList);

        List<String> businessAgencyList = new ArrayList<String>();
        directBind.setBusinessAgencyList(businessAgencyList);

        model.addAttribute("directBind", directBind);

        return "directBind";
    }


//code to add a Row to table

    @RequestMapping(value="/directBind", params="addPolicy")
    public String addPolicy(final DirectBind directBind, Model model){
        List<Ams360Policy> ams360Policies =  directBind.getAms360Policies();
        Ams360Policy ams360Policy = new Ams360Policy();
        ams360Policies.add(ams360Policy);
        model.addAttribute("ams360Policies", ams360Policies);


        List<String> billTypeList = new ArrayList<String>();
        billTypeList.add("Direct Bill");
        billTypeList.add("Agency Bill");
        model.addAttribute("billTypeList", billTypeList);
        ams360Policy.setBillTypeOptions(billTypeList);

        List<String> businessAgencyList = new ArrayList<String>();
        directBind.setBusinessAgencyList(businessAgencyList);

        return "directBind";
    }

//code to Remove row of table

@RequestMapping(value = "/directBind", params="removeRow")
public String removeRow(final DirectBind directBind, final HttpServletRequest req, Model model){
    final Integer rowId = Integer.valueOf(req.getParameter("removeRow"));
    List<Ams360Policy> ams360Policies =  directBind.getAms360Policies();
    model.addAttribute("ams360Policies", ams360Policies);
    directBind.setAms360Policies(ams360Policies);

    Ams360Policy ams360Policy = new Ams360Policy();
    List<String> billTypeList = new ArrayList<String>();
    billTypeList.add("Direct Bill");
    billTypeList.add("Agency Bill");
    model.addAttribute("billTypeList", billTypeList);
    ams360Policy.setBillTypeOptions(billTypeList);

    List<String> businessAgencyList = new ArrayList<String>();
    directBind.setBusinessAgencyList(businessAgencyList);

    directBind.getAms360Policies().remove(1);
    model.addAttribute("directBind", directBind);
    return "directBind";
}


//html code for table 
<div>
  <h4 style="display: inline;">AMS360 Policy Setup</h4>
  <input type="submit" formnovalidate="formnovalidate"  name="addPolicy" class="btn btn-default" style="margin-left: 1rem; margin-bottom: 1rem;" value="+"></input>
        </div>
        <div class="col-sm-12">
            <hr/>

            <table class="table table-striped AMSTable" data-classes="table-no-bordered" data-striped="true" data-show-columns="true" data-pagination="true">
                <thead>
                <tr>
                    <th>Policy Number</th>
                    <th>Policy Term Start Date</th>
                    <th>Policy Term End Date</th>
                    <th>Line of Coverage</th>
                    <th>Parent Company</th>
                    <th>Writing Company</th>
                    <th>Bill Type</th>
                    <th>Quote Premium</th>
                    <th>Commission</th>
                </tr>
                </thead>
                <tbody>
                <tr id="newPolicyRow" th:each="ams360Policy, stat : ${ams360Policies}">
                    <td> <input type="text" class="form-control" th:field="*{ams360Policies[__${stat.index}__].policyNumber}"/></td>
                    <td> <input type="text" class="form-control" th:field="*{ams360Policies[__${stat.index}__].policyTermDateStart}"/></td>
                    <td> <input type="text" class="form-control" th:field="*{ams360Policies[__${stat.index}__].policyTermDateEnd}"/></td>
                    <td> <input type="text" class="form-control" th:field="*{ams360Policies[__${stat.index}__].lineOfCoverage}"/></td>
                    <td> <input type="text" class="form-control" th:field="*{ams360Policies[__${stat.index}__].parentCompany}"/></td>
                    <td> <input type="text" class="form-control" th:field="*{ams360Policies[__${stat.index}__].writingCompany}"/></td>
                    <td id="billTypeCell">
                        <div  th:each="billType : ${billTypeList}">
                            <input type="checkbox" th:field="*{ams360Policies[__${stat.index}__].billTypeOptions}" th:value="${billType}"/>
                            <label th:text="${billType}" id="billTypeLabel"></label>
                        </div>
                    </td>
                    <td> <input type="text" class="form-control" th:field="*{ams360Policies[__${stat.index}__].quotePremium}"/></td>
                    <td> <input type="text" class="form-control" th:field="*{ams360Policies[__${stat.index}__].commission}"/></td>
                    <td class="text-right"> <button type="submit" name="removeRow" th:value="${stat.index}" class="btn btn-danger" ><span class="fa fa-trash"></span></button></td>
                </tr>
                </tbody>
            </table>
</div>

When I debug I get the following... enter image description here

javaspring-boothtml-tablethymeleafremovechild


Solution 1:[1]

//html code for table 
<div>
  <h4 style="display: inline;">AMS360 Policy Setup</h4>
  <input type="submit" formnovalidate="formnovalidate"  name="addPolicy" class="btn btn-default" style="margin-left: 1rem; margin-bottom: 1rem;" value="+"></input>
        </div>
        <div class="col-sm-12">
            <hr/>

            <table class="table table-striped AMSTable" data-classes="table-no-bordered" data-striped="true" data-show-columns="true" data-pagination="true">
                <thead>
                <tr>
                    <th>Policy Number</th>
                    <th>Policy Term Start Date</th>
                    <th>Policy Term End Date</th>
                    <th>Line of Coverage</th>
                    <th>Parent Company</th>
                    <th>Writing Company</th>
                    <th>Bill Type</th>
                    <th>Quote Premium</th>
                    <th>Commission</th>
                </tr>
                </thead>
                <tbody>
                <tr id="newPolicyRow" th:each="ams360Policy, stat : ${ams360Policies}">
                    <td> <input type="text" class="form-control" th:field="*{ams360Policies[__${stat.index}__].policyNumber}"/></td>
                    <td> <input type="text" class="form-control" th:field="*{ams360Policies[__${stat.index}__].policyTermDateStart}"/></td>
                    <td> <input type="text" class="form-control" th:field="*{ams360Policies[__${stat.index}__].policyTermDateEnd}"/></td>
                    <td> <input type="text" class="form-control" th:field="*{ams360Policies[__${stat.index}__].lineOfCoverage}"/></td>
                    <td> <input type="text" class="form-control" th:field="*{ams360Policies[__${stat.index}__].parentCompany}"/></td>
                    <td> <input type="text" class="form-control" th:field="*{ams360Policies[__${stat.index}__].writingCompany}"/></td>
                    <td id="billTypeCell">
                        <div  th:each="billType : ${billTypeList}">
                            <input type="checkbox" th:field="*{ams360Policies[__${stat.index}__].billTypeOptions}" th:value="${billType}"/>
                            <label th:text="${billType}" id="billTypeLabel"></label>
                        </div>
                    </td>
                    <td> <input type="text" class="form-control" th:field="*{ams360Policies[__${stat.index}__].quotePremium}"/></td>
                    <td> <input type="text" class="form-control" th:field="*{ams360Policies[__${stat.index}__].commission}"/></td>
                    <td class="text-right"> <button type="submit" name="removeRow" th:value="${stat.index}" class="btn btn-danger" ><span class="fa fa-trash"></span></button></td>
                </tr>
                </tbody>
            </table>
</div>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Daniel J. Paulino

Related Questions