Comment vérifier si l'image est générée avant de cliquer sur le bouton Soumettre?

Question

Je crée une application ASP.NET MVC5 qui utilise jSignature pour capturer la signature de l'utilisateur. Il ressemble à ceci, si vous n'êtes pas familier avec le plug-in:

Lorsque l'utilisateur clique sur « Enregistrer », une image de leur signature est générée et enregistrée dans un <img/> juste sous le pavé de signature:

Je veux faire une validation frontale pour m'assurer que l'utilisateur a cliqué sur "enregistrer" et, par conséquent, généré l'image de la signature avant de soumettre le formulaire entier. Je voudrais le faire avec jQuery si possible. J'ai une maquette de ce que je pense pseudo-code ce code est censé ressembler, mais je vais avoir du mal à le transformer en usage dans le monde réel:

$("#entireFormSubmitButton").click(function(){ 
    if($("#imageOfSignature").doesNotExistOnPage){ 
     alert("Your signature is required before submitting this form"); 
     // also block the user from submitting form until signature provided 
    } 
}); 

Je vais avoir écrit de la difficulté cette validation frontale personnalisée depuis qu'ASP.NET a déjà effectué la plus grande partie du travail pour m'assurer que tous les autres champs requis sont remplis. Puis-je obtenir de l'aide pour transformer cela en code fonctionnel?

Answer 1

$("#entireFormSubmitButton").click(function(e){ 
     //block the user from submitting and check for signature 
     e.preventDefault(); 
     if($("#imageOfSignature").length == 0 || 
      $("#imageOfSignature").attr("src") == "" || 
      $("#date-of-birth-input").val() == ""){ 
      alert("Your message"); 
     } else { 
      //all good, an image exists 
      $(this).closest('form').submit(); 
     } 
    });