diff --git a/web/components/management/party.js b/web/components/management/party.js
index 84e54a87e53403d635674d4c148454345a26914f..808c594f08dbfa244dcfcfb2a63e9ba2c270797f 100644
--- a/web/components/management/party.js
+++ b/web/components/management/party.js
@@ -32,11 +32,34 @@ class Party {
       >
         <div id="parties-card" class="card-no-hover">
           <header class="card-header">
-            <p class="card-header-title">
-              Partis
-            </p>
+            <nav class="level" style="width:99%">
+              <div class="level-left">
+                <p class="card-header-title">
+                  Partis
+                </p>
+              </div>
+              <div class="level-right">
+                <div class="field">
+                  <p class="control has-icons-right">
+                    <input
+                      id="party-search"
+                      class="input"
+                      placeholder="Rechercher un parti"
+                    />
+                    <span class="icon is-small is-right">
+                      <i class="fas fa-search"></i>
+                    </span>
+                  </p>
+                </div>
+              </div>
+            </nav>
           </header>
           <div class="card-content">
+            <button id="party-new" class="button large-button is-success">
+              <span class="icon is-small">
+                <i class="fas fa-plus"></i>
+              </span>
+            </button>
             <div
               id="party-list"
               class="content auto-overflow-election-management"
@@ -70,6 +93,10 @@ class Party {
       .addEventListener("click", async function () {
         await partyHandler.saveParty();
       });
+
+    document.getElementById("party-search").addEventListener("keyup", (e) => {
+      this.displayParties();
+    });
   }
 
   mountModal(where) {
@@ -150,16 +177,14 @@ class Party {
   }
 
   async displayParties() {
-    document.getElementById("party-list").innerHTML = /* HTML */ `<button
-      id="party-new"
-      class="button large-button is-success"
-    >
-      <span class="icon is-small">
-        <i class="fas fa-plus"></i>
-      </span>
-    </button>`;
+    document.getElementById("party-list").innerHTML = /* HTML */ ``;
 
     let parties = await this.PartyModel.getParties();
+    parties = parties.filter((party) =>
+      party.Name.toLowerCase().includes(
+        document.getElementById("party-search").value.toLowerCase()
+      )
+    );
     const markup = parties.map((party) => this.partyTemplate(party)).join("");
     document.getElementById("party-list").innerHTML += markup;
 
@@ -279,7 +304,7 @@ class Party {
       this.PartyModel.checkInputs(
         this.method,
         parseInt(document.getElementById("party-modal-id").value),
-        document.getElementById("party-modal-name").value,
+        document.getElementById("party-modal-name").value
       )
     ) {
       party = await this.PartyModel.saveParty(