Skip to main content

Multiple choices filters

Demo

Colors
Types
Radio Button Field

Ananas

Brun Jaune
Fruits

Avocat

Vert
Fruits

Banane

Jaune
Fruits

Brocoli

Vert
Légumes

Celeri

Vert
Légumes

Citron

Jaune
Fruits

Filet mignon

Gris
Viande

Lime

Vert
Fruits

Patate

Brun Jaune
Légumes

Pomme

Rouge
Fruits

Salade

Vert
Légumes

Steak

Rouge
Viande

Documentation

Importez la fonction dans votre projet

import { MultipleChoicesFilters } from "./functions/multiple-filters.js"

Instance et initialisation

Votre sélecteur est un div qui "wrap" vos multiples forms. Idéalement, utilisez un ID. Inspectez l'exemple ci-dessus si vous avez des questions ou regardez la structure HTML dans le fichier de template.

const myFilterMultiple = new MultipleChoicesFilters("#filter-wrapper-multiple", {
  // your options - view default values below
  divIds: ["listing"], 
  clearAllButtonId: "clear-all"
})

// init your newly created filter wrapper instance
myFilterMultiple.init()

Arguments - Options

  • Name
    Type
    Default
    Description
  • divIds
    Array - Liste de ID
    ["listing"]
    Array de <div> dont le contenu sera remplacé. Idéalement, utilisez des ids.
  • clearAllButtonId
    ID
    null
    ID du bouton pour tout désélectionner

Code

Dossier de base

Dossier des filtres