HTML How to dissociate a button from the form it's in?

Question

I have a HTML form, and a button inside of it, witch isn't submit. And when i click it, it sends the form, and reloads the page. Witch i don't want. I'd like to dissociate that button from the form it's in. Google didn't helped much. Here is the form :

      <form action="" method="post">

        <div class="form-group">
            <label for="jdrName">Nom du jeu de rôle :</label>
            <input type="text" class="form-control" name="jdrName"
                  placeholder="Nom du jeu">
        </div>

        <div class="form-group">
          <label for="jdrGenre1">Genre associé au jeu</label>
          <input type="text" class="form-control" name="jdrGenre1">
          <button id="addGenre" class="btn btn-success">Ajouter un genre</button>
        </div>

        <div class="form-group">
            <label for="jdrName">Date de sortie :</label>
            <input type="date" class="form-control" name="gameRelease">
        </div>

        <div class="form-group">
          <label for="jdrDescription">Description du jeu</label>
          <textarea class="form-control" name="jdrDescription" rows="5"
          placeholder="Entrez ici une description succinte du jeu"></textarea>
        </div>

        <div class="form-group">
          <label for="jdrLink">Lien vers le site du jeu</label>
          <input type="text" class="form-control" name="jdrLink">
        </div>

        <button type="submit" class="btn btn-primary">Valider</button>
      </form>

Thanks !

So do not make it a submit button. A button element's default type is submit. So set the type. ` — epascarello, Oct 07 '20 at 15:20
It's not. I have two buttons in this form, a submit one, at the bottom, and an other arout the middle. And the middle one sends the form, witch is my problem. — Gaëtan CHABOUSSIE, Oct 07 '20 at 15:22

score 1 · Accepted Answer · answered Oct 07 '20 at 15:22

1

You must precise that the button is of type="button", the default type being submit.

answered Oct 07 '20 at 15:22

Grégory Huyghe

422
1
6
18

HTML How to dissociate a button from the form it's in?

1 Answers1