How to send additional form data in ajax

Is there any other way to submit the form data that I could use from the script I am using, I tried to add the form data but cannot figure out how to get the paired values ​​in the post data, so I added the data to the url, the problem with that is a progress bar and the data stops working on my page.

<script>
function _(el){
    return document.getElementById(el);
}
function uploadFile(){
    var file = _("video").files[0];
    var vidName = $("#vidName").val();
    var videoDescription = $("#videoDescription").val();
    var albumName1 = $("#choosevidCat").val();
    var vidFile =$("#video").val();
    var otherData = $('vidUpload').serializeArray()
//       alert(file.name+" | "+file.size+" | "+file.type);
    var formdata = new FormData();
    formdata.append("video", file);
//  formdata.append("video", vidName);
    var ajax = new XMLHttpRequest();
    ajax.upload.addEventListener("progress", progressHandler, false);
    ajax.addEventListener("load", completeHandler, false);
    ajax.addEventListener("error", errorHandler, false);
    ajax.addEventListener("abort", abortHandler, false);
    ajax.open("POST", "includes/vid_upload.inc.php?vidName=" +vidName+"&videoDescription=" +videoDescription+"&albumName1=" 
    +albumName1, false);
    ajax.send(formdata);
}
function progressHandler(event){
    _("loaded_n_total").innerHTML = "Uploaded "+event.loaded+" bytes of "+event.total;
    var percent = (event.loaded / event.total) * 100;
    _("progressBar").value = Math.round(percent);
    _("status").innerHTML = Math.round(percent)+"% uploaded... please wait";
}
function completeHandler(event){
    _("status").innerHTML = event.target.responseText;
    _("progressBar").value = 0;
}
function errorHandler(event){
    _("status").innerHTML = "Upload Failed";
}
function abortHandler(event){
    _("status").innerHTML = "Upload Aborted";
}
</script>

      

I tried adding

formdata.append("video", vidName);

      

as you can see, I commented this out in the script as the webconsole showed, although it was sending the vidName variable, it didn't have an id tag like this: Content-Disposition: form-data; name = "video"

testing ogg creation 2

Can anyone help please

+3


source to share


1 answer


ajax.send("video=" + vidName + "&other=" + other_value);

      

if you want to send many values ​​you can use "&" keyword to separate names and values

as video = vidName, other = othervalue1, Misc2 = otherevalue2

to send it to post do request



"video=vidname&other=othervalue1&other2=othervalue2"

      

and in PHP you can get this post data

$_POST['video'];
$_POST['other'];
$_POST['other2'];

      

Here is the link Sending POST data using XMLHttpRequest

+3


source







All Articles