2010-08-02 1 views
2

есть ли способ привязать «представить» к fancybox после успеха?Fancybox jQuery ajax on success bind form Отправить

Вот что у меня есть:

<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> 

тогда я называю FancyBox и сделать некоторые проверки с помощью AJAX и 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);  
} 

и, наконец, мой 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; 
}  

}

сейчас - проверка правильности выполняется в первый раз, но я не могу повторно отправить форму - если я поместил некоторые значения в поля, они по-прежнему отображают предупреждения после нажатия кнопки «Отправить» - как будто это не распознало событие отправки.

Я добавил:

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

на успех в AJAX - но я не думаю, что это работает - какие-либо идеи?

ответ

3

Хорошо - в случае, если кто-то задавался вопросом - я решил проблему.

Это не было действительно обязательным - это были сообщения об ошибках - они не скрывались после перезагрузки.

Вот как у меня этой проблемы (возможно, не лучшее решение - но он работает):

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);  
} 

в основном - в начале функции tellAFriend() Я петельные через все элементы строки таблицы (tr) с классом «dn» и используйте hide(), чтобы скрыть его, - тогда, если все еще отсутствуют какие-либо значения, они снова появятся: