форма внутри формы сериализовать проблему

Question

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

    <script type="text/javascript">
    $(document).ready(function(){
        $("[id='video-submit']").click(function() { 
            $.ajax({
                type: "POST",
                data: $("#VideoForm").serialize(),
                url: "cp.asp?Process=UploadVideo",
                success: function(output) {
                    $("#output").html(output);
                },
                error: function(output) {
                    $("#output").html(output);
                }
            }); //close $.ajax(
        });
    });
    </script>
  <div id="form">
        <form method="post" action="?Section=controlpanel&Process=AddVideo">
            <fieldset>
                <div class="required" id="VideoForm">                
                    <label for="VideoURL">Video File</label>
                    <input type="file" size="23" name="VideoFile">
                    <input type="button" name="Submit" id="video-submit" value="Upload" />
                </div>
                <div id="output">
                </div>
            </fieldset>
            <fieldset>
                <div class="required">
                <label for="VideoName">Video Name</label>
                <input type="text" name="VideoName" id="form-text<%=VideoNAME_ERR%>" />
                </div>
                <div class="required">                
                    <label for="VideoDuration">Video Duration</label>
                    <input type="text" name="VideoDuration" id="form-text<%=VIDEODURATION_ERR%>"/>
                </div>
      <div class="required">                
                <label for="VideoShortDesc">Video Short Desc</label>
                <textarea rows="5" cols="30" name="VideoShortDesc" id="form-text<%=VideoSHORTDESC_ERR%>" ></textarea>
                </div>
                <div class="required">       
                    <label for="Publish?">Publish?</label>
                    <select size="1" name="Active" id="form-text">
                        <option value="1">Yes</option>
                        <option value="0">No</option>
                    </select>
                </div>
            </fieldset>
            <fieldset>
                <input type="submit" name="Submit" id="form-submit" value="Submit" />
            </fieldset>
        </form>
    </div>

cp.asp? Process = UploadVideo :::

    Case "UploadVideo"

Path = "/media/videos"

Set Upload = Server.CreateObject("Persits.Upload" ) 
Upload.IgnoreNoPost = True 
Upload.OverwriteFiles = False 
Upload.SetMaxSize 104850 ' Truncate files above 10MB
Upload.SaveVirtual(Path)

For Each File in Upload.Files 
    If File.ImageType = "UNKNOWN" Then 
    Response.Write "You cannot upload an unknown format." 
    File.Delete 
    Response.End 
    Else 

    Response.Write "Video successfully attached!"
    Response.Write "<input type=""hidden"" name=""VideoURL"" value=""/media/videos/" & Server.HTMLEncode(File.OriginalPath) &""" />"

    End If
Next

Answer 1

Это просто не сработает. В то время как JQuery может сериализовать поля формы и отправлять их на сервер с помощью AJAX, он не может сделать это с полем File.

Единственный способ отправить файл на сервер - использовать обычную форму публикации, и вам действительно следует использовать многочастное кодирование.

Answer 2

Ваша проблема немного отличается, но если проблема заключается в сериализации вложенных форм (поддерживается в Chrome, но не поддерживается в Firefox - поскольку HTML-код недействителен), вы можете использовать обходной путь:

$('#yourFormId, #yourFormId form').serialize();

, чтобы выбрать форму и подчиненные формы, затем сериализовать весь набор.

Answer 3

Вместо использования $().serialize() в div попробуйте вызвать $.param() и передать ему массив элементов формы. вот так:

$.param($('input[type!="button"][type!="submit"], textarea, select', '#VideoForm'))

Затем вы можете прикрепить обработчик событий, например, к кнопке загрузки:

uploadFile = function(event)  
{  
  params = $.param($('input[type!="button"][type!="submit"]', '#VideoForm'));

  // do something to submit your request using ajax

  // prevent the button from causing a form submit
  event.preventDefault();  
}

РЕДАКТИРОВАТЬ: Хм. Глядя на другие ответы, я не знаю, как я пропустил, что первый запрос должен был загрузить файл. Это было бы полезно, я полагаю, для других приложений, где форма выполняет простой частичный пост формы с параметрами.