La fenêtre jqmodal se ferme sur le formulaire soumis pour tous les navigateurs sauf FF

Question

J'ai une fenêtre de commentaires qui s'ouvre dans une petite fenêtre jqmodal. J'essaie d'utiliser $ .ajax pour soumettre le formulaire et montrer le "succès" dans la petite fenêtre modale. mais dans tous les navigateurs sauf firefox, le modal se ferme lorsque je soumets le formulaire.

<script type="text/javascript"> 
$().ready(function() { 

$('.reportForm').submit(function(){ 
    if (document.rForm.comment.value != "") { 
     $('.reportForm').hide(); 

     $.ajax({ 
      type: "POST", 
      url: "<?php echo $_SERVER["PHP_SELF"]; ?>?c=<?php echo $c; ?>", 
      cache: false, 
      data: "comment=" + document.rForm.comment.value, 
      success: function(html){ 
         $("#results").append(<?php echo get_option('ddrc_success'); ?> + " "); 
        } 

     }); 
     return false;   
    } 

}); 
}); 

fs

Answer 1

Je ne suis pas sûr à 100% mais le problème pourrait être dans cette ligne:

if (document.rForm.comment.value != "") { 

Je ne pense pas que ce code est cross-browser. En supposant rForm dans le .reportForm, vous pouvez le remplacer par

if ($(this).find("[name='comment']").val()) { 

$(this) dans ce contexte fera référence $('.reportForm'), parce que vous liez à reportForm « s soumettre un événement. find("[name='comment']") va localiser un élément enfant avec le nom de l'attribut est un commentaire. val() renvoie la valeur de l'élément.

En outre, la façon dont vous avez écrit cette méthode s'il n'y a pas de valeur dans le champ de commentaire, le formulaire sera soumis de la manière normale.

Vous quitterions

return false; 

être la dernière ligne dans votre méthode.

L'exemple retravaillé tout:

<script type="text/javascript"> 
    $(function() { 
     $('.reportForm').submit(function() { 
      if ($(this).find("[name='comment']").val()) { 
       $(this).hide(); 

       $.ajax({ 
        type: "POST", 
        url: "<?php echo $_SERVER["PHP_SELF"]; ?>?c=<?php echo $c; ?>", 
        cache: false, 
        data: "comment=" + $(this).find("[name='comment']").val(), 
        success: function(html) { 
         $("#results").append(<?php echo get_option('ddrc_success'); ?> + " "); 
        } 

       }); 
      } else { 
       alert("Please, fill the comment field"); 
      } 
      return false;     
     }); 
    }); 
</script>