Публиковать данные, не отправляя должным образом с плагином формы jQuery

Question

Фон: я работаю над страницей управления для музыкантов. Допустим, пользователь создает альбом, а затем загружает песню в альбом. Я использую сообщения ajax с плагином формы jQuery.

Сначала я работал над загрузкой песен в существующие альбомы (отлично работает).

Затем я работал над созданием новых альбомов и появлялся без обновления, используя.append() и.attr (прекрасно работает).

Сейчас я работаю над загрузкой песни в альбом, который появился благодаря append ().

Проблема: когда созданный альбом готов, он грандиозен. Все значения и функции точно такие же, как у альбома, загруженного при визуализации страницы.

Когда я пытаюсь загрузить песню, я получаю сообщение об ошибке на стороне сервера. Это берет те же самые функции, которые я использую, чтобы загрузить песню в альбом ajaxed как начальный альбом рендеринга страницы.

Я обновляю страницу и могу загрузить песню.

Я использую плагин jQuery.form, и я подумал, что это будет, потому что функция была внутри $(document).ready(function { ... }

скрипт загрузки:

$('form#uploadSongToAlbum').submit(function() { 
  $(this).ajaxSubmit({
    target: 'login/uploadSongToAlbum.php',
    dataType:  'html',
    beforeSubmit: function() { 
      alert(showRequest);
      $.jGrowl("Uploading... hold on...<br />", { life:1000 });
    }, 
    success: function() {
      selectUploadedID(); 
    },
    error: function() {
      $.jGrowl(textStatus, {  header:"<span style='color:red'>Error:</span>", sticky: true });
    }
  });
  return false; 
});

Теперь, углубившись в проблему, я открыл консоль в Chrome, зашел в сеть и записал опубликованные запросы как для загрузки с ajaxed, так и для загрузки с загрузкой страницы, и обнаружил очень разные значения. Вот ajaxed значения поста загрузки (этот ломается):

Данные формы:

Файл:silence2.mp3

Альбом:80

и вот загруженные страницы значения поста (этот работает):

Запросить полезную нагрузку:

------ WebKitFormBoundaryZpJpGxBLJEBRYadH Content-Disposition: form-data; Name="файл"; filename="silence2.mp3" Тип контента: аудио / mp3

------ WebKitFormBoundaryZpJpGxBLJEBRYadH Content-Disposition: form-data; name="album" 80

------ WebKitFormBoundaryZpJpGxBLJEBRYadH--

Большое спасибо заранее всем. Я должен делать что-то не так. Я могу предоставить больше кода, если это необходимо. Имейте в виду: html-разметка и значения как для ajaxed-альбомов, так и для загруженных страниц альбомов действительны. Это должно быть что-то JQuery, что я делаю не так...

Answer 1

Попробуйте добавить enctype атрибут тега формы динамически создаваемого контента:

<form id="uploadSongToAlbum" action="login/uploadSongToAlbum.php" method="post" enctype="multipart/form-data">
    <!-- snip... -->
</form>

Кроме того, если ваш скрипт загрузки вызывается изнутри $(document).ready, он будет вызываться только один раз при загрузке страницы. Если вы хотите, чтобы он применялся к динамически создаваемым формам, используйте метод `live()':

$('form#uploadSongToAlbum').live('submit', function() { 
    // ajaxSubmit code here....
});