0

cada que intento probar para subir imagenes (varias hojas que forman un capitulo),el boton no hace nada tampoco me manda a error , muestra algun mensaje en la pantalla , o me redirige a una direcion vacia.por eso es que no se que corregir para que responda.

subir_hojas.php en la carpeta bin

<?php 
    require_once("../bin/clases.php");
    $hoja = new Mangas();
    $hojas = $hoja->subirHojas($_POST['Capitulo'],$_POST['Volumen'],$_FILES, $_POST['mangaRel']);
?>

la parte del meta en el head del html relacionado a la pagina del formulario de subida

<script>
        $(document).ready(function(){
            $("#file").on("change", function() {
                $("#vista-previa").html('');
                var archivos = document.getElementById('file').files;
                var browser = window.URL || window.webkitURL;
                for (var i = 0; i<archivos.length;i++) {
                    var size =  archivos[i].size;
                    var type = archivos[i].type;
                    var name = archivos[i].name;
                    if(size > 5000000) {
                        $("#vista-previa").append("<h1>El archivo "+name+" supera el tamaño permitido.</h1>");
                    }else if(type != 'image/jpeg' && type != 'image/jpg' && type != 'image/png'){
                        $("#vista-previa").append("<h1>El tipo de archivo "+name+" no esta permitido.</h1>");
                    }else {
                        var objeto_url = browser.createObjectURL(archivos[i]);
                        $("#vista-previa").append("<div style='margin: 5px; display: inline';float: left;><img width='89' height='140' src="+objeto_url+" width='300' height='300'></div>");
                    }
                }
            });

            $("#btn").on("click", function () {
                var formData = new FormData($("#formulario")[0]);
                $.ajax({
                    url: "../bin/subir_hojas.php",
                    type: "post",
                    data: formData,
                    contentType: false,
                    processData: false,
                    success: function (r) {
                        $("#res").html(r);
                    }
                });
            });

        });

</script>



el formulario de subida ,aqui se encuentra el boton como id="btn" y no me salta a nada solo se ilumina por los css ,pero al clikearlo la pagina se mantiene igual no se refresca la pagina ni me redirecciona , la avista previa que le sigue funciona bien ,y los demas espacios se llenan correctamente hasta que llego ala parte del boton .

<?php
    $manga = new Mangas();
    $mangas = $manga->mangaUsuario();
?>              
<div class="margen ">
    <div class="container  ">
        <div class="row justify-content-center">
            <div class="col-md-5 jumbotron_admin ">
                <form method="post" id="formulario" enctype="multipart/form-data">
                    <p class="text-white">SUBIR CAPITULO </p>
                    <div class="form-group">
                        <label for="ejemplo_text_1" class="text-white">Obra</label>
                        <select  name="mangaRel" class="form-control">
                        <option value="">Seleccione un Manga</option>
                        <?php foreach($mangas as $datos): ?>
                        <option value="<?php echo $datos['id']; ?>"><?php echo $datos['nombre']; ?></option>
                        <?php endforeach ?>
                        </select>
                    </div>
                    <div class="form-group">
                        <label for="ejemplo_text_1" class="text-white">Numero del volumen</label>
                        <input type="text" name="Volumen" class="form-control" placeholder="Numero del Volumen">
                    </div>
                    <div class="form-group">
                        <label for="ejemplo_text_2" class="text-white">Capitulo</label>
                        <input type="text" name="Capitulo" class="form-control" placeholder="Numero del Capitulo">
                    </div>
                    <div class="form-group">
                        <label for="ejemplo_archivo_1" class="text-white ">Adjuntar un archivo</label>
                        <input type="file" name="file[]" id="file" multiple>
                    </div>

                    <button type="button" class="btn btn-success" id="btn">subir Hojas</button>
                </form>
                <br>
                <div class="marco">
                    <div id="vista-previa"></div>
                    <div id="res"></div>
                </div>

            </div>

        </div>
    </div>
</div>

la clase.php en la carpeta bin es el ultimo en la linea


    class Mangas extends Conexion {
        public function Mangas(){
            parent::__construct();
        }
            public function subirHojas($numeroCap,$numeroVol,$hojas,$mangaRel){//metodo con parametros del formulario
            
            if(isset($hojas["file"])){//condicional para saber si hay imagenes
                for ($i=0; $i <count($hojas['file']['name']) ; $i++) { //bucle para recorrer todas imagenes
                    $file = $hojas['file']; //array de todas la imagenes
                    $nombre = $file['name'][$i]; // nombre de la imagen
                    $tipo = $file['type'][$i]; // tipo de imagen
                    $size = $file['size'][$i]; //tamaño de la imagen
                    $ruta_temp = $file['tmp_name'][$i]; //ruta tamporales de la imagen
                    $carpeta = $_SERVER["DOCUMENT_ROOT"] . "/manga/img/capitulos/"; //ruta personalizada
                    if ($tipo != 'image/jpeg' && $tipo != 'image/jpg' && $tipo != 'image/png' && $tipo != 'image/png') {
                        echo $reporte .= "<p>Error: ".$nombre." no es una iamgen.</p>";//condicional para validar el tipo deimagen
                    }else if($size > 5000000){
                        echo $reporte .= "<p>El tamaño del archivo excede el maximo permitido.</p>";//condicional para validadr el tamaño deimagen
                    }else{
                        $src = $carpeta.$nombre;
                        move_uploaded_file($ruta_temp, $src);//mandamos la imagen al directorio propuesto
                        
                    }
                    $sql = "INSERT INTO capitulos(hoja, pagina, hojaRel) VALUES (:hoja, :pagina, :hojaRel)";//consulta para la insersion de registro a la base de datos
                    $statement = $this->base->prepare($sql);
                    $page = $i +1;
                    $statement->execute(array(':hoja' => $nombre,':pagina' => $page, ':hojaRel' => $mangaRel));                 
                }
                $sql = "INSERT INTO capitulosmanga(numeroCap, numeroVol, mangaRel) VALUES (:numeroCap, :numeroVol, :mangaRel)";//consulta para la insersion de registro a la base de datos
                    $statement = $this->base->prepare($sql);
                    $statement->execute(array(':numeroCap' => $numeroCap, ':numeroVol' => $numeroVol, ':mangaRel' => $mangaRel));
                echo "<p>Sus imagenes se subieron exitosamente.</p>";//respues devuelta por aJAX
            }
        }
        public function URLCapitulo($id){
            $sql = "SELECT * FROM capitulosmanga WHERE capitulosmanga.mangaRel = '$id' ORDER BY capitulosmanga.numeroCap DESC";
            $statement = $this->base->query($sql);
            $statement->execute(array());
            $resultado = $statement->fetchAll(PDO::FETCH_ASSOC);;
            $statement->closeCursor();
            return $resultado;
        }
        public function hojas($id){
            $sql = "SELECT * FROM capitulos,capitulosmanga WHERE capitulos.hojaRel='$id' AND capitulosmanga.id = '$id'";
            $statement = $this->base->query($sql);
            $statement->execute(array());
            $resultado = $statement->fetch(PDO::FETCH_ASSOC);;
            $statement->closeCursor();
            return $resultado;
        }
        public function getLink($x,$id){
            $sql = "SELECT * FROM capitulos,capitulosmanga WHERE capitulos.hojaRel='$id' AND capitulosmanga.id = '$id' LIMIT $x,1";
            $statement = $this->base->query($sql);
            $statement->execute(array());
            $resultado=$statement->fetchAll(PDO::FETCH_ASSOC);
            return $resultado;
        }
        public function numeroFilas(){
            $sql = "SELECT * FROM capitulos";
            $statement = $this->base->query($sql);
            $statement->execute(array());
            $resultado = $statement->rowCount();
            return $resultado;
        }
        public function eliminarManga($id){
            $this->base->query("DELETE FROM manga WHERE id='$id'");
            header('location: ../_admin/panel.php');
        }
        public function eliminarCapitulos($id){
            $this->base->query("DELETE FROM manga WHERE id='$id'");
            header('location: ../_admin/panel.php');
        }
    }

primero va del formulario al meta.php que lo coloco en el head del html con require_once, para ahorrar lineas de codigo ,a todas las paginas relacionadas con la seccion de admin,luego val subir_hojas.php que tambien se encuentra en la carpeta bin y al ultimo la clase para que se suba al servidor sql .

1 respuesta 1

1

A simple vista no estoy seguro donde puede estar el error sin hacer pruebas, pero puedo entregar tips para debugging:

  • Lo primero es revisar la consola por algún aviso de error. En Firefox es con F12, en Chrome con Ctrl+Shift+I.

  • Segundo, un console.debug(r) en la funcion success para ver recibe javascript al hacer el llamado.

Con respecto al error, puede ser que el formulario se está enviando al hacer click (lo cual no debiese pasar si está definido como type="button", pero siempre es bueno tener una función que ataja el comportamiento submit de formulario para que actúe de la misma forma que al hacer click en el botón.

$('#formulario').on('submit', function(e) {
   e.preventDefault()
   // la misma funcion de botón
   return false
}

Saludos.

2
  • le di a inspeccionar ,y al clickear el subir hojas ,salta un problema como :Uncaught TypeError: $.ajax is not a function,se refiere a esta linea del meta :$.ajax({ url: "../bin/subir_hojas.php", type: "post", data: formData, contentType: false, en especial el ajax , debo linkear algo al meta? ,ya tenia esto encima :<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> pero no parece funcionar.
    – MC DIEL
    Commented el 22 mar. 2021 a las 22:47
  • ya esta saolucionado :es.stackoverflow.com/questions/95063/… lo dejo ,gracias .
    – MC DIEL
    Commented el 22 mar. 2021 a las 23:31

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.