通过单击Django Web中的表头列对表格进行排序

因此，我在django中有一个网站。我有一个表，像ServerName，IP等几个colums .. 我想有列的标题排序整个列。例如，当我单击ServerName列时，它将按ServerName的ABC顺序排列所有项目。通过单击Django Web中的表头列对表格进行排序

我听说过django-sorting-bootstrap，但该指南看起来很复杂。有没有更容易或更好的指导来做到这一点？这个想法是点击头部的箭头，它会将它整理出来（它会像链接一样）。

的index.html表 -

<div class="container"> 

    <br> 
    <center><h1>DevOps Server List</h1></center> 
    <br> 
    <form method='GET' action=''> 
     <input type='text' name='q' placeholder='Search Item'/> 
     <input type='submit' value='Search' /> 
    </form> 
    <table class="table table-hover"> 
    <thead> 

     <tr> 
     <th> Server Name </th> 
     <th> Owner </th> 
     <th> Project </th> 
     <th> Description </th> 
     <th> IP Address </th> 
     <th> ILO </th> 
     <th> Rack </th> 
     <th> Status </th> 
     <th> </th> 


    </tr> 
    </thead> 
    <tbody> 

       {% for server in posts %} 

     <tr> 
      <div class ="server"> 
      <td>{{ server.ServerName }}</td> 
      <td>{{ server.Owner }}</td> 
      <td>{{ server.Project }}</td> 
      <td>{{ server.Description }}</td> 
      <td>{{ server.IP }}</td> 
      <td>{{ server.ILO }}</td> 
      <td>{{ server.Rack }}</td> 
      <td>{{ server.Status }}</td> 

      <td> 


         <button type="button" class="btn btn-primary" data-toggle="modal" href="#delete-server-{{server.id}}" data-target="#Del{{server.id}}">Delete <span class="glyphicon glyphicon-trash" </span></button> 
         <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#DeleteItem">Edit <span class="glyphicon glyphicon-pencil" </span></button> 
         <div id ="Del{{server.id}}" class="modal fade" role="document"> 
          <div class="modal-dialog" id="delete-server-{{server.id}}"> 
            <div class="modal-content"> 
             <div class="modal-header"> 
              <h5 class="modal-title">Delete Confirmation</h5> 
              <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
           <span aria-hidden="true">&times;</span> 
            </button> 
             </div> 
             <div class="modal-body"> 
             <form action="{% url 'delete_post' server.id %}" method="post">{% csrf_token %} 
              <h6>Are you sure you want to delete {{ server.ServerName }}?</h6> 

              <input type="submit" class="btn btn-danger btn-md" value="Confirm delete"/> 
               <button type="submit" class="btn btn-secondary" data-dismiss="modal">Cancel</button> 

             </form> 
            </div> 
            </div> 


         </div> 
      </div> 
      </td> 
       </div> 
     </tr> 
       {% endfor %} 
    </tbody> 
</h5> 
    </table>

来源

2017-10-15 Eilon Ashkenazi

通过单击Django Web中的表头列对表格进行排序

回答

相关问题