通過單擊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中的表頭列對錶格進行排序

回答

相關問題