Comment fermer le modal Bootstrap (5.2) en utilisant Javascript ?

Question

Pour le bien d'un projet scolaire, j'ai créé un modal utilisant bootstrap en HTML dans lequel il y a une invite que je dois vérifier à partir de javascript, comment puis-je fermer le modal à partir de javascript afin de pouvoir simplement enregistrer les modifications si l'invite est valide, sinon, vais-je lever une exception ? Petite note (veuillez ne pas utiliser jQuery, j'ai vu un fil de discussion similaire qui utilisait cette bibliothèque comme réponse interdisant l'allocation)

Voici mon code html :

<div class="modal fade" id="bidModal" tabindex="-1" aria-labelledby="bidModal" aria-hidden="true">
        <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h1 class="modal-title fs-5" id="bidModalLabel">Bid amount</h1>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <p class="text" id="prompted">How much do you want to bet?</p>
                <div class="input-group mb-2">
                    <input id="bAmount" type="text" class="form-control text" aria-label="Amount of bet">
                    <span class="input-group-text">€</span>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" data-bs-dismiss="modal">Cancel bid</button>
                <button type="button" onClick="bid()" class="btn btn-success">Save bid</button>
            </div>
        </div>
        </div>
    </div>

Voici mon code JavaScript :

function bid(){
    let valueOfBid = document.getElementById("bAmount").value;
    if(isNaN(valueOfBid)){
        //Cancel the prompt
    }

    players[realPlayer].bet=valueOfBid;
    changeButtonState(false);
    theTimer();
}

Answer 1

Vous pouvez l'ajouter à l'élément où le modal doit être désactivé...

data-bs-dismiss="modal"

Le modèle suivant génère une liste de liens basée sur les termes de recherche et les correspondances d'utilisateurs.

Lorsqu'ils cliquent sur l'un des liens du routeur, le modal sera désactivé à cause de cette ligne

{{ user }}

Le code ci-dessus est généré en modal -> voici le tout

    

      

        

          

            
Find User
            
          
          

            Steem Username:
            
          
          

          

            

              {{ user }}
            
          
          

            
              Close
            
          
        
      
    
  

Answer 2

Veuillez essayer ceci. Je vous recommande d'ajouter isNaN(valueOfBid) 更改为 valueOfBid == "" avant d'ajouter mon code à la base de code.

function bid(){
    let valueOfBid = document.getElementById("bAmount").value;
    if(valueOfBid == ""){
      alert(1)
        //Cancel the prompt
      var myModalEl = document.getElementById('bidModal');
var modal = bootstrap.Modal.getInstance(myModalEl)
modal.hide();
    }

    // players[realPlayer].bet=valueOfBid;
    // changeButtonState(false);
}