提问者:小点点

表格中的垂直滚动条


<div class="table-responsive">
<!-- <div id="mtsdetails_wrapper" class="dataTables_wrapper no-footer"><div class="dt-buttons">      <button class="dt-button buttons-csv buttons-html5" tabindex="0" aria-controls="mtsdetails" type="button"><span>CSV</span></button> <button class="dt-button buttons-excel buttons-html5" tabindex="0" aria-controls="mtsdetails" type="button"><span>Excel</span></button> <button class="dt-button buttons-pdf buttons-html5" tabindex="0" aria-controls="mtsdetails" type="button"><span>PDF</span></button> <button class="dt-button buttons-print" tabindex="0" aria-controls="mtsdetails" type="button"><span>Print</span></button> </div> -->
                                                    <span th:if="${actd_viewtrue != null && actd_viewtrue == 'valpresent' }">
                                                     
                                                                
                                                    <table id=shortstorage class="table table-hover table-bordered dataTable no-footer" role="grid" aria-describedby="mtsdetails_info">
                                                        <thead>
                                                            <tr role="row">
                                                            <th class="sorting_desc" tabindex="0" aria-controls="mtsdetails" rowspan="1" colspan="1" aria-label="Sr.No.: activate to sort column ascending" style="width: 43px;" aria-sort="descending">Sr.No.</th>
                                                            <th class="sorting" tabindex="0" aria-controls="mtsdetails" rowspan="1" colspan="1" aria-label="Name: activate to sort column ascending" style="width: 41px;">Name</th>
                                                            <th class="sorting" tabindex="0" aria-controls="mtsdetails" rowspan="1" colspan="1" aria-label="CIN Number: activate to sort column ascending" style="width: 66px;">CIN Number</th>
                                                            <th class="sorting" tabindex="0" aria-controls="mtsdetails" rowspan="1" colspan="1" aria-label="Address: activate to sort column ascending" style="width: 58px;">Address</th>
                                                            <th class="sorting" tabindex="0" aria-controls="mtsdetails" rowspan="1" colspan="1" aria-label="State: activate to sort column ascending" style="width: 37px;">State</th>
                                                            <th class="sorting" tabindex="0" aria-controls="mtsdetails" rowspan="1" colspan="1" aria-label="District: activate to sort column ascending" style="width: 51px;">District</th>
                                                            <th class="sorting" tabindex="0" aria-controls="mtsdetails" rowspan="1" colspan="1" aria-label="Contact Details: activate to sort column ascending" style="width: 72px;">Name&Designation</th>
                                                            <th class="sorting" tabindex="0" aria-controls="mtsdetails" rowspan="1" colspan="1" aria-label="Mobile: activate to sort column ascending" style="width: 46px;">Mobile</th>
                                                            <th class="sorting" tabindex="0" aria-controls="mtsdetails" rowspan="1" colspan="1" aria-label="Fax: activate to sort column ascending" style="width: 25px;">Fax</th>
                                                            <th class="sorting" tabindex="0" aria-controls="mtsdetails" rowspan="1" colspan="1" aria-label="Email: activate to sort column ascending" style="width: 38px;">Email</th>
                                                            <th class="sorting" tabindex="0" aria-controls="mtsdetails" rowspan="1" colspan="1" aria-label="Status:activate to sort column ascending" style="width:45px;">Status</th>
                                                            <th class="sorting" tabindex="0" aria-controls="mtsdetails" rowspan="1" colspan="1" aria-label="Remarks:activate to sort column ascending" style="width:45px;">Remarks</th>
                                                            
                                                            <span th:if="${actd_addtrue == 'addpresent'}">
                                                            <th class="sorting" tabindex="0" aria-controls="mtsdetails" rowspan="1" colspan="1" aria-label="Action:activate to sort column ascending" style="width:45px;">Action</th>
                                                            </span>
                                                            
                                                            <span th:each="sec_chk : ${actd}">
                                                            <span th:if="${sec_chk == 'View'}">
                                                            <th class="sorting" tabindex="0" aria-controls="mtsdetails" rowspan="1" colspan="1" aria-label="View: activate to sort column ascending" style="width: 36px;">View</th>
                                                            </span>
                                                            </span>
                                                                
                                                            <span th:each="sec_chk : ${actd}">
                                                            <span th:if="${sec_chk == 'Edit'}">
                                                            <th class="sorting" tabindex="0" aria-controls="mtsdetails" rowspan="1" colspan="1" aria-label="View: activate to sort column ascending" style="width: 36px;">Edit</th>
                                                            </span>
                                                            </span>
                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                                            
                                                         <tr role="row" class="odd" th:each="compregloop,incr : ${compregList}">
                                                                <td th:text="${incr.count+ srno}" class="sorting_1"></td>
                                                                <td th:text="${compregloop.companyname}"></td>
                                                                <td th:text="${compregloop.cin_number}"></td>
                                                                <td th:text="${compregloop.Author_Address}"></td>
                                                                <td>
                                                                <div th:each="statedrop : ${stateselections}">
                                                                <span th:if="${compregloop.registeredoffice_state == statedrop.statecode}" th:text="${statedrop.statename_inenglish}"></span>
                                                                <!-- <span th:unless="${compregloop.Registeredoffice_Statecode == statedrop.statecode}" th:text="${compregloop.Registeredoffice_Statecode}"></span>
                                                                 -->
                                                                 </div>
                                                                 </td>
                                                                <td>
                                                                <div th:each="districtselection: ${distsel}">
                                                                <span th:if="${compregloop.registeredoffice_districts == districtselection.districtcode}" th:text="${districtselection.districtname_inenglish}"></span> 
                                                                </div>
                                                                </td>
                                                                <td> 
                                                                <span th:if="${compregloop.Author_Name == null}">
                                                                </span>
                                                                <span th:unless="${compregloop.Author_Name == null}" th:text="${compregloop.Author_Name+' '+'('+compregloop.Author_Designation+')'}">
                                                                </span>
                                                                </td>
                                                                <td th:text="${compregloop.Author_Mobile}"></td>
                                                                <td th:text="${compregloop.Author_Fax}"></td>
                                                                <td th:text="${compregloop.Author_Email}"></td>
                                                                <td th:text="${compregloop.verificationstatus}"></td>
                                                                <td th:text="${compregloop.verificationremarks}"></td>
                                                                <span th:if="${actd_addtrue == 'addpresent'}">
                                                                <td>                                    
                                                                 <a class="btn btn-success btn-xs" data-toggle="modal" th:data-target="'#myModal' + ${compregloop.id}"  href="#"> Accept / Reject</a>
                                                              <div class="modal" th:id="'myModal'+ ${compregloop.id}" style="display: none;">
                                                                <div class="modal-dialog">
                                                                    <div class="modal-content">
                                                                      <div class="modal-header">
                                                                        <h4 class="modal-title">Approval</h4>
                                                                      </div>
                                                                      <div class="modal-body">
                                                                        <form class="form-horizontal active" th:action="@{'/acceptrejectcompany/'+${compregloop.id}}" th:object="${cmpreg}" role="form" id="form_5"  method="post">   <!--form_4 start -->                                       
                                                                            
                                                                            <div class="form-group">
                                                                                <label class="col-md-3 control-label"></label>
                                                                                <div class="col-md-7">
                                                                                    <input id="companystatus" type="radio" name="companystatus" class="" value="Accepted"> Accept
                                                                                    <input id="companystatus" type="radio" name="companystatus" class="" value="Rejected"> Reject
                                                                                </div>
                                                                            </div>
                                                                            <div class="form-group">
                                                                                <label class="col-md-3 control-label">Remarks</label>
                                                                                <div class="col-md-7 col-sm-7 col-xs-12">
                                                                                    <textarea name="remarks" class="form-control"></textarea>
                                                                                </div>
                                                                            </div>
                                                                            
                                                                            
                                                                            
                                                                            <div class="form-group ">
                                                                                <label class="col-md-3 control-label">&nbsp;</label>
                                                                                <div class="col-sm-7">
                                                                                    <button type="submit" onclick="return radiocheck()" class="btn btn-info waves-effect waves-light">Submit</button>
                                                                                </div>
                                                                            </div>
                                                                            
                                                                            
                                                                        </form>
                                                                      </div>
                                                                      <div class="modal-footer">
                                                                        <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
                                                                      </div>
                                            
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            
                                                            </td>
                                                            </span>
                                                                
                                                                <span th:each="sec_chk : ${actd}">
                                                                <span th:if="${sec_chk == 'View'}">
                                                                <td><a th:href="@{'/view_applicationdetails/'+${compregloop.id}}">View</a></td>
                                                                </span>
                                                                </span>
                                                                
                                                                 
                                                                
                                                                <span th:each="sec_chk : ${actd}">
                                                                <span th:if="${sec_chk == 'Edit'}">
                                                                 <td> <a th:href="@{'/editcompany/'+${compregloop.id}}">Edit</a> </td>
                                                                 </span>
                                                                 </span>
                                                                
                                                                 
                                                                 </tr>
                                                            </tbody>
                                                    </table>
                            
                                                </span>
                            <span th:unless="${actd_viewtrue != null && actd_viewtrue == 'valpresent' }">
                            <label>YOU ARE NOT AUTHORISED TO VIEW THIS PAGE.PLEASE CONTACT ADMINISTRATOR</label>
                            </span>
                         
                        
                                                    <!-- <div class="dataTables_info" id="mtsdetails_info" role="status" aria-live="polite">Showing 1 to 1 of 1 entries</div> -->
                                                    <!-- <div class="dataTables_paginate paging_simple_numbers" id="mtsdetails_paginate"><a class="paginate_button previous disabled" aria-controls="mtsdetails" data-dt-idx="0" tabindex="0" id="mtsdetails_previous">Previous</a><span><a class="paginate_button current" aria-controls="mtsdetails" data-dt-idx="1" tabindex="0">1</a></span><a class="paginate_button next disabled" aria-controls="mtsdetails" data-dt-idx="2" tabindex="0" id="mtsdetails_next">Next</a></div> -->
                                                <!-- </div> -->
                                                </div> 

嗨,我做了一个桌子,我有水平滚动条在它,但我必须使垂直滚动条在多少方式,我可以添加它。 我不想在其中使用jquery数据表。


共1个答案

匿名用户

null

.table-responsive {
    max-height:90vh; //you can adjust this value
}
<div class="table-responsive">
  <table class="table">
    ...
  </table>
</div>