Question

I am trying to submit a form inside another form because I will need first form s outcome in the second form. I tried using form serialize as advised in some other threads. Problem here is, I dont receive an error but it does not function either.

    <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

That just isn t going work. Whilst JQuery can serialise form fields and post them to the server using AJAX it can t do that to a File field.

The only way you going to get a file posted to the server is by using a normal Form post and you really ought to use multipart encoding.

Answer 2

Instead of using $().serialize() on the div try calling $.param() and passing it an array of form elements. like so:

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

Then you can attach an event handler like this to the upload button:

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();  
}

EDIT: Hmm. Looking at the other answers I don t know how I missed that the first request was supposed to upload a file. This would be useful I suppose for other applications where the the form is doing a simple partial post of a form with parameters.

Answer 3

Your problem is slightly different, but if the problem is serialising nested forms (supported in chrome, but not supported in Firefox - since the HTML is invalid), you can use a work around:

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

to select a form and subforms, then serialise the entire set.

友情链接