Изменения содержимого в fancybox div появляются только после закрытия и повторного открытия

Question

У меня есть форма, которая отображается в jQuery FancyBox div с идентификатором "mcform". Когда кнопка нажата, я вызываю эту функцию:

function postit() {
  $.ajax({
    type: "POST",
    url: 'listSubscribe.php',
    data: "fname=" + $("#fname").val() + "&lname=" + $("#lname").val() 
      + "&email=" + $("#email").val(),
     success: function(msg) {
        $('#mcform').html(msg);
        $("#fname").val('');
        $("#lname").val('');
        $("#email").val('');
    }
  });   
}

Я вижу в консоли, что listSubscribe.php выдает заголовок 200 и возвращает текст. Однако форма не меняется, за исключением того, что значения стираются. Но если я закрою FancyBox и снова открою его, и вот, есть текст, возвращенный listSubscribe.php, заменяющий html формы как положено.

У кого-нибудь есть идеи, что могло бы вызвать это? Я предполагаю, что борюсь с FancyBox, но я не знаю, что с этим делать.

Страница находится здесь: http://dominiquesonmag.com/new.html

Спасибо за чтение!

Answer 1

Это работает

function postit() {
 $.ajax({
   type: "POST",
   url: 'listSubscribe.php',
   data: $("#mcform form").serialize(),
   success: function(msg) {
       $('#fancy_content').children().children().html(msg);
        $("#fname").val('');
        $("#lname").val('');
        $("#email").val('');
   }
 });   
}

, так как вы ссылаетесь на mcform по id, он просто устанавливает значение в первом найденном элементе, вместо этого заменяет его на класс, скажем mcformclass, и пытается $('.mcformclass').html(msg);, этоследует изменить значение в обоих случаях mcform.

Answer 2

просматривая эту страницу, я заметил, что в почтовом чипе DIV есть еще один DIV с ID = 'mcform'. это может быть причиной проблемы, потому что он пытается установить HTML в другой DIV.

также пара советов: используйте serialize () для создания строки данных, и вы можете выбрать все входные элементы в форме, чтобы установить их значения в пустые строки:

function postit() {
 $.ajax({
   type: "POST",
   url: 'listSubscribe.php',
   data: $("#mcform form").serialize(),
   success: function(msg) {
       $('#mcform').html(msg);
       $("#mcform input").val('');
   }
 });   
}