Клонирование или добавление ввода в форму в jQuery не передает в PHP в Firefox

Question

$('#images_upload_add').click(function(){
   $('.images_upload:last').after($('.images_upload:last').clone().find('input[type=file]').val('').end());        
});

использование этого кода для добавления файловых входов не загружает файл в Firefox.

также

$('#image_server_add input[type=button]').click(function(){
    var select = $(this).siblings('select').find(':selected');
    if(select.val()){
        $('#image_server_add').before('<tr class="images_selection"><td><input type="button" value="Delete"></td><td class="main">'+select.html()+'<input type="hidden" value="'+select.html()+'" name="images_server[]"/></td></tr>');
    }
})

также не загружает значения в $ _POST

Я не могу найти ничего, чтобы сказать, почему это не будет работать в документации, это работает в IE, но не в Firefox / WebKit

Почему эти примеры не будут правильно загружать значения формы?

Answer 1

Нижняя строка разметки на странице была искажена.

Форма была в макете на основе таблицы, не по моему выбору, а объявление формы было внутри tr.

Я переместил объявление формы в родительский td ввода формы, и теперь оно работает.

Это интересный результат, учитывая, что механизм рендеринга будет правильно отправлять входные данные, которые неправильно размещены, но пытаетесь добавить эти входные данные с помощью jQuery / javascript? в том же месте не будет работать в Firefox / WebKit.

Я полагаю, что это связано с манипуляциями dom, которые делает javascript, и тем, как он может быть более строгим в отношении требований к элементам уровня блока.

Будем благодарны за любые замечания / предположения о моих выводах.

Answer 2

Возникает ли у вас такая же проблема, если вы создаете новый вход, а не клонируете существующий?

Вы меняете имя клонированного ввода, чтобы избежать конфликтов имен, или используете имя стиля массива (например, file[])?

Какова цель добавления разметки выбранной опции к скрытому вводу?

Ради интереса, пробовали ли вы использовать .clone(true)?

Answer 3

Я попал в этот раздел из Google, ища похожую проблему.

Мне удалось это исправить, сделав шаг назад к проблеме -

в примере формы:

    <table>
<form method="post">
<tr>some content <input type="text" name="test"> </tr>
</form>
</table>

По какой-то причине это будет работать в Internet Explorer, но на самом деле это недопустимый HTML. Переместите теги формы за пределы таблицы, например так:

<form method="post">
    <table>
<tr>some content <input type="text" name="test"> </tr>
</table> 
</form>

И тогда это будет работать.

Таким образом, входные данные будут работать нормально (даже динамически), у меня было много проблем, когда форма будет работать, пока вы не вставите больше входных данных или элементов формы - будут отправляться только оригинальные элементы, которые было очень трудно отследить .

Answer 4

Возможно, вместо добавления элемента в момент отправки формы, вставьте элемент, но со значениями по умолчанию.

Затем при нажатии кнопки заполните этот элемент правильным значением.

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

Answer 5

Вау! Иногда jQuery может быть слишком плотным для чтения. Также помогло бы, если бы мы могли видеть вашу разметку.
Ударить в темноте, потому что я догадываюсь, что ты пытаешься сделать.

Вы не можете программно ввести имя файла в поле файла, и оно будет загружено на сервер. Это было бы опасно.

Возможно, я лаю не на том дереве?