web-dev-qa-db-fra.com

Comment créer un bouton Annuler dans Bootstrap

J'ai le balisage Bootstrap suivant:

<!-- Text input-->
<div class="form-group">
  <label class="col-md-4 control-label" for="username">Username</label>
  <div class="col-md-4">
  <input id="username" name="username" type="text" placeholder="" class="form-control input-md" required="" maxlength="8" value="">
  </div>
</div>

<!-- Button (Double) -->
<div class="form-group">
  <label class="col-md-4 control-label" for="submit"></label>
  <div class="col-md-8">
    <button id="submit" name="submit" class="btn btn-primary" value="1">Create Profile</button>
    <button id="cancel" name="cancel" class="btn btn-default" value="1">Cancel</button>
  </div>
</div>

Lorsque je clique sur le bouton Create Profile, le formulaire fonctionne correctement et me permet de savoir que certains champs sont "obligatoires". Mais lorsque je clique sur le bouton Cancel, je ne peux pas quitter le formulaire en raison de champs obligatoires incomplets.

Existe-t-il une fonctionnalité de bouton d'annulation de formulaire dans Bootstrap?

8
H. Ferrence

Modifiez votre code comme suit:

<!-- Button (Double) -->
<div class="form-group">
  <label class="col-md-4 control-label" for="submit"></label>
  <div class="col-md-8">
    <button id="submit" name="submit" class="btn btn-primary" value="1">Create Profile</button>
    <a href="/link-to/whatever-address/" id="cancel" name="cancel" class="btn btn-default">Cancel</a>
  </div>
</div>
10
Adrian Chrostowski

configurez simplement l'attribut type pour qu'il soit réinitialisé comme indiqué ci-dessous;

<button type="reset" class="btn btn-default pull-right">Cancel</button>

0
Emmanuel Aninze