0

I am using bootstrap table with thymeleaf. when page initially loads, i want to bind the Department (retrieved using spring mvc) object to bind with bootstrp-table. how do i do that? I am trying this, but the values are not binding with td

i have imported below bootstrap-table js and css using webjar

<link rel="stylesheet"
    href="webjars/bootstrap-table/1.9.1/dist/bootstrap-table.min.css"
    th:href="@{/webjars/bootstrap-table/1.9.1/dist/bootstrap-table.min.css}"/>
<script type="text/javascript"
    src="webjars/bootstrap-table/1.9.1/dist/bootstrap-table.min.js"
    th:src="@{/webjars/bootstrap-table/1.9.1/dist/bootstrap-table.min.js}"></script> 

   <div class="form-group">
                    <label class="col-sm-2 control-label">Employees:</label>
                    <div class="col-sm-3">
                        <table id="eventsTable" data-toggle="table" data-height="300"
                            data-url=""
                            data-pagination="true" data-search="true" data-show-refresh="true"
                            data-show-toggle="true" data-show-columns="true"
                            data-toolbar="#toolbar">
                            <thead>
                                <tr>
                                    <th data-field="state" data-checkbox="true"></th>
                                    <th data-field="name">Name</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr th:each="employees: ${department.employees}">
                                    <td th:text="${employees.name}">AC</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>

but when I use the below code it works, But below i am not using the bootstrap data table.

  <div class="col-sm-3">
                    <table class="table">
                        <caption>Employees</caption>
                        <thead>
                            <tr>
                                <th scope="col">Name</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr th:each="employee : ${department.employees}">
                                <td th:text="${employee.name}">1</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
Shravan Ramamurthy
  • 3,896
  • 5
  • 30
  • 44

0 Answers0