function objetoAjax() {
var xmlhttp = false;
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
xmlhttp = false;
}
}
if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
xmlhttp = new XMLHttpRequest();
}
return xmlhttp;
}
var xhttp = objetoAjax();
function enviar(form) {
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("respuesta").innerHTML = this.responseText;
} else {
document.getElementById("respuesta").innerHTML = "no enviado";
}
}
xhttp.open("POST","subir.php", true);
xhttp.send(new FormData(form));
}
-
puedes mostrar tu codigo html y php– Luciano MontañezCommented el 24 jul. 2018 a las 22:37
-
si claro ahorita lo muestro– Vanegas9090Commented el 25 jul. 2018 a las 4:26
-
pudiste probar la respuesta anterior ?– Luciano MontañezCommented el 25 jul. 2018 a las 4:35
-
si pero igual me dio el mismo error, que no se recibe ningun archivo– Vanegas9090Commented el 25 jul. 2018 a las 5:16
Añade un comentario
|
3 respuestas
Podrías resumir tu código con jquery, esto enviaría tu form por post, a la url indicada
$("#MyForm").submit(function(e) {
var url = "subir.php";
$.ajax({
type: "POST",
url: url,
data: $("#MyForm").serialize(),
success: function(data)
{
document.getElementById("respuesta").innerHTML = data;
},
error: function (xhr, ajaxOptions, thrownError) {
document.getElementById("respuesta").innerHTML = "no enviado";
}
});
e.preventDefault();
});
Este es el codigo HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>index</title>
<script type="text/javascript" src="ajax.js"></script>
</head>
<body>
<div id="respuesta">
hola mundo
</div>
<form id="form" action="javascript: enviar(this)">
<input type="file" name="archivo" id="archivo">
<input type="submit" value="enviar">
</form>
</body>
</html>
este es el codigo PHP
<?php
$nombre_temporal = $_FILES['archivo']['tmp_name'];
$nombre = $_FILES['archivo']['name'];
echo $nombre;
$destino = "archivos/" . $nombre;
move_uploaded_file($nombre_temporal, $destino);
?>
Ya, lo puedes hacer de la siguiente manera: tienes el elemento HTML
<input id="foto" class="form-control" name="file1" type="file" />
Aqui las funciones JS, la función que sube el archivo es "uploadFile"
function _(el){
return document.getElementById(el);
}
function uploadFile(){
var file = _("file1").files[0];
var formdata = new FormData();
formdata.append("file1", file);
formdata.append("id_curso", $("#id_curso").val());
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", "{LA_RUTA}");
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);
}
function completeHandler(event){
var obj = JSON.parse(event.target.response);
if(obj.Result == "OK"){
//"Realizado Correctamente."
}else{
}
_("progressBar").value = 0;
}
function errorHandler(event){
_("status").innerHTML = "Upload Failed";
}
function abortHandler(event){
_("status").innerHTML = "Upload Aborted";
}
El codigo PHP
$fileName = $_FILES["file1"]["name"];
$fileTmpLoc = $_FILES["file1"]["tmp_name"];
$fileType = $_FILES["file1"]["type"];
$fileSize = $_FILES["file1"]["size"];
$fileErrorMsg = $_FILES["file1"]["error"];
if (!$fileTmpLoc) {
//exit();
}
move_uploaded_file($fileTmpLoc, "{LA_RUTA_DONDE_GUARDA}")