Maison  >  Questions et réponses  >  le corps du texte

Tri des tableaux HTML

<p>Donc, fondamentalement, j'exécute une requête MySQL qui récupère les données de ma base de données et les affiche dans une présentation facile à lire pour l'utilisateur. </p> <pre class="brush:php;toolbar:false;">Nom-----Adresse----Vendeur</pre> <p>Vous comprenez l’essentiel. Maintenant, je veux que l'utilisateur trie le tableau HTML par vendeur. Comment puis-je le faire facilement à l’aide d’un menu déroulant ? </p> <p><br /></p> <pre class="snippet-code-html lang-html Prettyprint-override"><code><div class='menu'> <ul> <li><a href='#'><span>Vendeur</span></a> <ul> <li><a href='#'><span>Melissa</span></a></li> <li><a href='#'><span>Justin</span></a></li> <li><a href='#'><span>Judy</span></a></li> <li><a href='#'><span>Skipper</span></a></li> <li><a href='#'><span>Alex</span></a></li> </ul> ≪/li> </ul> </div></code></pre> <p><br /></p>
P粉752479467P粉752479467442 Il y a quelques jours519

répondre à tous(2)je répondrai

  • P粉785905797

    P粉7859057972023-08-28 10:42:03

    C'est une autre bibliothèque.

    Les changements à apporter sont -

    1. Ajouter des js de tri

    2. Ajoutez le nom de la classe sortable au tableau.

    Cliquez sur le titre du tableau pour trier le tableau en conséquence :

    <script src="https://www.kryogenix.org/code/browser/sorttable/sorttable.js"></script>
    
    <table class="sortable">
      <tr>
        <th>Name</th>
        <th>Address</th>
        <th>Sales Person</th>
      </tr>
    
      <tr class="item">
        <td>user:0001</td>
        <td>UK</td>
        <td>Melissa</td>
      </tr>
      <tr class="item">
        <td>user:0002</td>
        <td>France</td>
        <td>Justin</td>
      </tr>
      <tr class="item">
        <td>user:0003</td>
        <td>San Francisco</td>
        <td>Judy</td>
      </tr>
      <tr class="item">
        <td>user:0004</td>
        <td>Canada</td>
        <td>Skipper</td>
      </tr>
      <tr class="item">
        <td>user:0005</td>
        <td>Christchurch</td>
        <td>Alex</td>
      </tr>
    
    </table>

    répondre
    0
  • P粉642920522

    P粉6429205222023-08-28 00:27:23

    Vérifiez si vous pouvez utiliser l'un des plugins JQuery mentionnés ci-dessous. Tout simplement fantastique, offre un large éventail d’options de travail et nécessite moins d’efforts à intégrer. :)

    https://github.com/paulopmx/Flexigrid - Flexgrid
    http://datatables.net/index - Tableaux de données.
    https://github.com/tonytomov/jqGrid

    Sinon, vous devez avoir un lien vers ces en-têtes qui appellent le script côté serveur pour appeler le tri.

    répondre
    0
  • Annulerrépondre