Fancybox jQuery ajax sur la forme de liaison de succès Envoyer

Question

est-il un moyen de lier le "soumettre" à la fancybox après le succès?

Voici ce que j'ai:

<div class="ta_l" id="tell_friend"> 
    <form id="form_tell_friend" method="post" action="">    
     <table cellspacing="0" cellpadding="0" border="0" class="tbl_insert mr_b0"> 
      <tbody> 
       <tr class="tell_friend_email dn"> 
        <th>&nbsp;</th> 
        <td><span class="red">Please provide a valid email address</span></td> 
       </tr> 
       <tr> 
        <th><label for="tell_friend_email">Email: *</label></th> 
        <td><input type="text" class="fld" value="" id="tell_friend_email" name="tell_friend_email" /></td> 
       </tr> 
       <tr class="tell_friend_content dn"> 
        <th>&nbsp;</th> 
        <td><span class="red">Please provide a message</span></td> 
       </tr> 
       <tr> 
        <th><label for="tell_friend_content">Message: *</label></th> 
        <td><textarea class="tartiny" rows="" cols="" id="tell_friend_content" name="tell_friend_content"></textarea></td> 
       </tr> 
       <tr> 
        <th>&nbsp;</th> 
        <td> 
         <label class="sbm sbm_blue small" for="tell_friend_btn"> 
          <input type="submit" value="Send" class="btn" id="tell_friend_btn" /> 
         </label> 
        </td> 
       </tr> 
      </tbody> 
     </table> 
    </form> 
</div> 

j'appelle fancybox et faire une validation avec ajax et php:

// tell a friend form 
if($('.tell-friend').length > 0) { 

    $('.tell-friend').fancybox({ 
     'speedIn'  : 600, 
     'speedOut'  : 200, 
     'overlayShow' : true, 
     'scrolling'  : 'no', 
     'titleShow'  : false  
    }); 

    function tellAFriend() { 

     $.ajax({ 
      type : "POST", 
      cache : false, 
      url  : "/message/run/tellafriend", 
      data : $(this).serializeArray(), 
      dataType: "json", 
      success: function(data) { 
       $("#form_tell_friend").bind("submit", tellAFriend);     
       if(data != 1) { 
        $.each(data, function(key, value) { 
         $('.' + value).fadeIn(500); 
        }); 
        $.fancybox.resize(); 
        $("#form_tell_friend").bind("submit", tellAFriend);      
       } else { 
        $.fancybox({ 
         'scrolling'  : 'no', 
         'content'  : 'Your message has been sent successfully' 
        }); 
       }         
      }, 
      error: function(data) { 
       alert('Error occured'); 
      } 
     }); 

     return false; 
    } 

    $("#form_tell_friend").bind("submit", tellAFriend);  
} 

et enfin mon php:

public function tellafriendAction() { 
$empty = array(); 

if(!empty($_POST)) { 
    foreach($_POST as $key => $value) { 
     if (empty($value)) { 
      $empty[] = $key; 
     } 
    } 
} 

if(!empty($empty)) { 
    echo json_encode($empty); 
} else { 
    echo 1; 
}  

}

Maintenant - la validation se passe bien la première fois, mais je ne peux pas renvoyer le formulaire - si je mets des valeurs dans les champs, il affiche toujours des avertissements après avoir cliqué sur le bouton Soumettre - comme s'il ne reconnaissait pas l'événement submit.

J'ai ajouté:

$("#form_tell_friend").bind("submit", tellAFriend); 

sur le succès en ajax - mais je ne pense pas que ça fonctionne - une idée?

Answer 1

Ok - au cas où quelqu'un se demandait - j'ai résolu le problème.

Ce n'était pas vraiment contraignant - c'était les messages d'erreur - ils ne se sont pas cachés après rechargement.

Voilà comment j'ai contourner ce problème (peut-être pas la meilleure solution - mais il fonctionne):

if($('.tell-friend').length > 0) { 

    $('.tell-friend').fancybox({ 
     'speedIn'  : 600, 
     'speedOut'  : 200, 
     'overlayShow' : true, 
     'scrolling'  : 'no', 
     'titleShow'  : false  
    }); 

    function tellAFriend() { 
     var rows = $('tr.dn'); 
     $.each(rows, function() { 
      $(this).hide(); 
     }); 
     $.ajax({ 
      type : "POST", 
      cache : false, 
      url  : "/message/run/tellafriend", 
      data : $(this).serializeArray(), 
      dataType: "json", 
      success: function(data) {         
       if(data != 1) { 
        $.each(data, function(key, value) { 
         $('.' + value).fadeIn(500); 
        }); 
        $.fancybox.resize(); 
       } else { 
        $.fancybox({ 
         'scrolling'  : 'no', 
         'content'  : 'Your message has been sent successfully' 
        }); 
       }         
      }, 
      error: function(data) { 
       alert('Error occured'); 
      } 
     }); 

     return false; 
    } 

    $("#form_tell_friend").bind("submit", tellAFriend);  
} 

essentiellement - au début de la fonction parler à un ami() Je l'ai mis en boucle à travers tous les éléments de la ligne de table (tr) avec la classe "dn" et utilisé hide() pour le masquer - alors s'il y a encore des valeurs manquantes - ils apparaîtront à nouveau:

var rows = $('tr.dn'); 
     $.each(rows, function() { 
      $(this).hide(); 
     });