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将它们发布到服务器，但它无法对文件字段执行此操作。

您要将文件发布到服务器的唯一方法是使用普通的表单帖子，您真的应该使用多部分编码。

Answer 2

不要在div上使用$().serialize()，而是尝试调用$.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();  
}

编辑：嗯。看看其他答案，我不知道我错过了第一个请求应该上传文件。这对于其他应用程序来说非常有用，在这些应用程序中，表单正在对带有参数的表单进行简单的部分发布。

Answer 3

您的问题略有不同，但如果问题是序列化嵌套表单（在Chrome中支持，但Firefox不支持 - 因为HTML无效），您可以使用解决方法：

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

选择表格和子表格，然后序列化整个集合。

形成内部形式序列化问题

3 个答案: