2

Como puedo cambiar el valor del estatus al subir documentos, estoy desarrollando una pequeña funcionalidad para cargar documentos esta se encuentra en una tabla donde tengo un numero de factura y un botón para subir documentos, el botón de subir documentos despliega una ventana modal donde allí se cargan los documentos.

Cree este pequeño fragmento de código para explicar mejor la funcionalidad.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"></script>

<div class="col-sm-12">
    <table id="example">
        <thead>
            <tr>
                <th>Factura</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>
                    2910
                </td>
                <td>
                    <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#ModalCargaFactura">Cargar Documentos</button>
                </td>
            </tr>
        </tbody>
    </table>
</div>

<div class="modal fade bd-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" id="ModalCargaFactura" data-backdrop="static" data-keyboard="false" >
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
              <div class="modal-header" style="background: #36AD52;">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                  <span aria-hidden="true" style="color: #FFFFFF;">&times;</span>
                </button>
              </div>
              <div class="modal-body">
       <form action="" enctype="multipart/form-data">
          <div class="form-group row">
                        <label for="fileToUpload" class="col-sm-3 col-form-label"> Archivo XML:</label>
              <div class="col-sm-8">
                <input type="file" name="fileToUpload" id="XmlToUpload" class="btn" accept=".xml" onchange="ValidarArchivos()" required>
              </div>
                    </div>
                    <div class="form-group row">
                         <label for="pdfToUpload" class="col-sm-3 col-form-label">Archivo PDF:</label>
              <div class="col-sm-8">
              <input type="file" name="pdfToUpload" id="pdfToUpload" class="btn" accept=".pdf" onchange="ValidarArchivos()" required>
              </div>
                    </div>      
              </div>

          <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancelar</button>
            <button type="button" id="upload" class="btn btn-success">Subir Documentos</button>
          </div>
      </form>
            </div>
      <div class="upload-msg"></div>
          </div>
        </div>

La carga de los documentos la estoy realizando con AJAX y PHP, adjunto a continuación el siguiente JQuery donde cargo el documento y valido el formato

$(document).ready(function(){
    $("#upload").on("click", function(){
        const ArchivoXml = $("#XmlToUpload").prop('files')[0];
        const ArchivoPDF = $("#pdfToUpload").prop('files')[0];
       

        //Validación para comprobar que sea el formato corecto
        if (ArchivoXml.type !== 'text/xml') {
            $('#XmlToUpload').val('');
            //$('#pdfToUpload').val('');
            alert('Por favor seleccione los archivos con el formato correcto');
            return;
          }

        const datosForm = new FormData;

        datosForm.append("XmlToUpload", ArchivoXml);
        datosForm.append("pdfToUpload", ArchivoPDF);

        const filePath="server.php"
        //console.log(ArchivoXml);
        $.ajax({
            type:'POST',
            cache: false,
            contentType: false,
            processData: false,
            data: datosForm,
            url:filePath
        }).done(function(data){
            alert(data)
        }).fail(function(){
            alert('El archivo no se pudo cargar')
        });       
    });   
});

El siguiente es el código PHP con el cual indico la ruta donde se almacenara

server.php

<?php
    if(isset($_FILES["XmlToUpload"])){
        $archivo = $_FILES["XmlToUpload"]["name"];
        $ruta ="XML/";

        if(move_uploaded_file($_FILES["XmlToUpload"]["tmp_name"],$ruta.$archivo)){
            echo "Subido exitosamente";
        }else{
            echo "Error al subir";
        }          
    }else {
        echo "No se selecciono un archivo";
    }

if(isset($_FILES["pdfToUpload"])){
        $archivo = $_FILES["pdfToUpload"]["name"];
        $ruta ="PDF/";

        if(move_uploaded_file($_FILES["pdfToUpload"]["tmp_name"],$ruta.$archivo)){
            echo "Subido exitosamente";
        }else{
            echo "Error al subir";
        }
        //echo "SI LLEGO";
    }else {
        echo "No se selecciono un archivo";
    }

?>

Si se fijan cargo dos archivos diferentes es por esta razón que se agregan dos input

Ahora explicara la forma en como se muestra la información en la tabla, la siguiente es una función Javascript con la cual construyo mi tabla

/* Formatting function for row details - modify as you need */
function format(d) {
    // `d` is the original data object for the row
    console.log(d);
      let tabla = `<table cellpadding="5" cellspacing="0" style="border-collapse: separate; border-spacing: 40px 5px;">
                    <thead>
                        <tr>
                            <th>
                                Factura
                            </th>
                            <th>
                                Estatus
                            </th>
                        </tr>
                        </thead>
                        <tbody>`;
                            d.Factura.forEach(f => {
                                tabla += `<tr>                              
                                <td>${f.Factura}</td>       
                                <td>${f.Estatus}</td>                               
                                <td><button type="button" class="btn btn-primary" data-toggle="modal" data-target="#ModalCargaFactura" onclick="CargarFactura('${f.OrdenCompra}' , '${f.Factura}')"`;
                                if (disabled.indexOf(f.Estatus) > -1) {
                                    tabla += ` disabled `;
                                  }
                                  tabla += `>Cargar Documentos</button></td>                               
                                <td><button type="button" class="btn btn-primary" onclick="MostrarDetalleFactura('${f.Factura}')">Ver Detalle</button></td>
                                </tr>`;
                            });
                       tabla += '</tbody></table>';
                       return tabla;    
}

Como ven en el codigo anterior muestro la factura y Estatus adicional a esto contiene el boton Cargar Documentos el cual me despliega una ventana modal la cual ubique en el primer fragmento de codigo.

El siguiente es el código que tengo en mi back con la ayuda de PHP

<?php
    header('Content-Type: text/html; charset=utf-8');
    //error_reporting(E_ALL ^ E_NOTICE);

    $param = $_POST['param'];   
    switch($param) {
        case '1': 
                $query = array();
                include './db/conectar.php';
                $USER = utf8_encode($_POST['proveedor']);
                $sql = "{call SPTest(?)}";
                
                $params = array($USER);
                $stmt = sqlsrv_query($conn, $sql, $params);
                $stmt1 = sqlsrv_query($conn, $sql, $params);        
                if ( $stmt === false) {
                    die( print_r( sqlsrv_errors(), true) );
                }
                
                //Se inicializa el arreglo antes del ciclo
                $query = [];
                $query1 = [];
                //Se necesita numero de orden de compra para agrupar
                $ultimaOrden = '';
                $ultimaFactura = '';
                
                while( $row1 = sqlsrv_fetch_array($stmt1) ) {
                    $record1 = array(
                        "Factura"  => $row1['Factura']
                        
                    );
                    array_push($query1, $record1);
                }
                
                while( $row = sqlsrv_fetch_array($stmt) ) {
                if(strcmp($ultimaFactura, utf8_encode ($row['Factura'])) != 0) {
                
                    $query[$indice]["Factura"][] = [
                        "Factura"          => utf8_encode ($row['Factura']), //No Factura   
                        "Estatus"           => $row['Estatus'],                                 
                    ];
                
                    $ultimaFactura = utf8_encode ($row['Factura']);
                }
                
                }

                sqlsrv_free_stmt( $stmt);       
                sqlsrv_close($conn);

                $json = [
                    "success"=> count($query) > 0 ? true : false,
                    "data"=>$query
                ];

                echo json_encode($json);
        break;
        
        ?>

Como ven aquí realizo el llamado a un procedimiento almacenado para mostrar la información, así es como de esta manera muestra la información en la tabla que realmente no se si sea información relevante para ayudar a solucionar la funcionalidad que planteo en mi pregunta inicial.

Con lo anterior así explicado en palabras mas palabras menos lo que deseo es cambiar el estatus que contiene la factura al momento de subir ambos documentos ese estatus al que deseo que cambie es 0, de muchas ideas que me surgen en mi cabeza estaba pensando en hacer un nuevo procedimiento almacenado y que realice un UPDATE al estatus de la factura a la cual se le cargo los documentos.

Actualización:

Al ver que en una de las respuestas hace falta cambiar el estatus me coloque en la tarea de realizar un procedimiento almacenado que realizara el cambio

ALTER PROCEDURE [dbo].[SPTest]
    @factura    VARCHAR(30)
AS
BEGIN
    
    UPDATE PACKING
        SET ESTATUS = 1 
        WHERE ID=@factura;
        
END 

Actualización 2:

Este es el código que estoy usando en mi server.php

<?php            
    // Obtén número de factura o cadena vacía
  $factura = (isset($_POST['factura'])) ? trim($_POST['factura']) : '';
  print_r($factura);
  echo "Probando";

  // Define el arreglo que vas a devolver
  $res = [
      'factura' => ($factura != ''),
      'xml' => (isset($_FILES["XmlToUpload"]) && $_FILES["XmlToUpload"]['error'] == 0),
      'pdf' => (isset($_FILES["pdfToUpload"]) && $_FILES["pdfToUpload"]['error'] == 0)
  ];

  // Solo si hay número de factura
  if($res['factura']) {
      // Solo si se subió archivo XML y no tuvo error
      if($res['xml']) {
          $archivo = $_FILES["XmlToUpload"]["name"];
          $ruta ="XML/";

          if(!move_uploaded_file($_FILES["XmlToUpload"]["tmp_name"], $ruta . $archivo)) {
              // Hubo error, poner propiedad en falso
              $res['xml'] = false;
          }          
      }
      // Solo si se subió archivo PDF y no tuvo error
      if($res['pdf']) {
          $archivo = $_FILES["pdfToUpload"]["name"];
          $ruta ="PDF/";

          if(!move_uploaded_file($_FILES["pdfToUpload"]["tmp_name"], $ruta . $archivo)) {
              // Hubo error, poner propiedad en falso
              $res['pdf'] = false;
          }          
      }
      // ¿Se subieron los dos archivos?
      if($res['xml'] && $res['pdf']) {
          // Aquí ejecutas la consulta para actualizar estado de factura
          // Ya tienes el número en la variable $factura
         // $factura = (isset($_POST['factura']));

          include './db/conectar.php';
          $sql = "exec PortalProveedores_CambioEstatus(?)";

          $factura = (isset($_POST['factura'])) ? trim($_POST['factura']) : '';
         
          $stmt = sqlsrv_query($conn, $sql, $factura);
          if ( $stmt === false) {
              die( print_r( sqlsrv_errors(), true) );
          }

          sqlsrv_free_stmt( $stmt);     
          sqlsrv_close($conn);
      }
  }
  // Devuelves el arreglo
  echo json_encode($res);

?>

Adicional a este código muestro la función junto con el llamado AJAX para subir los documentos:

//Función que carga los documentos
$(document).ready(function(){
    $("#upload").on("click", function(){
        const ArchivoXml = $("#XmlToUpload").prop('files')[0];
        const ArchivoPDF = $("#pdfToUpload").prop('files')[0];
       

        //Validación para comprobar que sea el formato corecto
        if (ArchivoXml.type !== 'text/xml' && ArchivoPDF.type !== 'text/pdf' ) {
            $('#XmlToUpload').val('');
            $('#pdfToUpload').val('');
            alert('Por favor seleccione los archivos con el formato correcto');
          }        

        const datosForm = new FormData;

        datosForm.append("XmlToUpload", ArchivoXml);
        datosForm.append("pdfToUpload", ArchivoPDF);

        datosForm.append('factura', $('#numToUpload').val());

        //console.log('Factura es:', $("#numToUpload").text());


        const filePath="server.php"
        //console.log(ArchivoXml);
        $.ajax({
            type:'POST',
            cache: false,
            contentType: false,
            processData: false,
            data: datosForm,
            url:filePath
        }).done(function(data){
            alert(data)
        }).fail(function(){
            alert('El archivo no se pudo cargar')
        });       
    });   
});

El código donde muestro mi ventana modal es el siguiente, en este código muestro el numero de factura junto con los dos input de los archivos xml y pdf

<!-- Modal -->
            <div class="modal fade bd-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" id="ModalCargaFactura" data-backdrop="static" data-keyboard="false" >
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                  <div class="modal-header" style="background: #36AD52;">
                    <h4 class="modal-title" id="exampleModalLongTitle" style="color: #FFFFFF;">Agregar Factura</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                      <span aria-hidden="true" style="color: #FFFFFF;">&times;</span>
                    </button>
                  </div>
                  <div class="modal-body">
                    
                        <div class="form-group row">
                            <label for="lblNombreVisita" class="col-sm-3 col-form-label">Factura:</label>
                            <div class="col-sm-8">
                              <input type="text" class="form-control" id="numToUpload" disabled>
                            </div>
                         </div>
        
           <form action="" enctype="multipart/form-data">
              <div class="form-group row">
                            <label for="fileToUpload" class="col-sm-3 col-form-label"> Archivo XML:</label>
                  <div class="col-sm-8">
                    <input type="file" name="fileToUpload" id="XmlToUpload" class="btn" accept=".xml" onchange="ValidarArchivos()" required>
                  </div>
                        </div>
                        <div class="form-group row">
                             <label for="pdfToUpload" class="col-sm-3 col-form-label">Archivo PDF:</label>
                  <div class="col-sm-8">
                  <input type="file" name="pdfToUpload" id="pdfToUpload" class="btn" accept=".pdf" onchange="ValidarArchivos()" required>
                  </div>
                        </div>      
                  </div>
    
              <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancelar</button>
                <button type="button" id="upload" class="btn btn-success">Subir Documentos</button>
              </div>
          </form>
                </div>
          <div class="upload-msg"></div>
              </div>
            </div>

Ahora despues de borrar el codigo que me sobraba estoy obteniendo el siguiente error al subir los documentos

Warning: sqlsrv_query() expects parameter 3 to be array, string given in C:\xampp\htdocs\GUI-PT\server.php on line 77
Array ( [0] => Array ( [0] => IMSSP [SQLSTATE] => IMSSP [1] => -14 [code] => -14 [2] => An invalid parameter was passed to sqlsrv_query. [message] => An invalid parameter was passed to sqlsrv_query. ) )

Para ser mas exacto el error me lo indica en la siguiente linea

 $stmt = sqlsrv_query($conn, $sql, $factura);
4
  • @Triby Si es correcto, me estoy basando en tu respuesta la variable esta definida como factura (con minúscula) pero igual sigue sin cambiar de estatus, algo mas que deba agregar o cambiar ?
    – John Doe
    el 21 may. 2021 a las 15:50
  • Esta línea $factura = (isset($_POST['factura'])); va a hacer que la variable $factura tenga un valor booleano (falso o verdadero), elimínala, no necesitas volver a definir esa variable.
    – Triby
    el 21 may. 2021 a las 16:32
  • @Triby Los mensajes "Subido exitosamente" proviene de la validación al cargar archivos (xml, pdf), acabo de agregar el código tal cual como me indicaste en el ultimo comentario y además borre el de las actualizaciones
    – John Doe
    el 21 may. 2021 a las 19:23
  • Te sobra todo el código desde //echo "hola mundo"; hasta // Obtén número de factura o cadena vacía, bórralo, porque ahí mueves los archivos como la hacías antes y, debajo, al intentar usar nuevamente move_uploaded_file() falla, porque los archivos temporales ya no existen.
    – Triby
    el 21 may. 2021 a las 19:46

1 respuesta 1

1

Aquí hay un problema de concepto muy grande, porque quieres realizar cambios en la factura y, sin embargo, no envías el número para saber cuál es la que está recibiendo documentos y, por lo tanto, solo subes los archivos, pero no los asocias a la factura.

Para que no tengas que hacer más modificaciones en tu script:

  • Agrega una clase al botón que abre la ventana, quedando así: <button type="button" class="btn btn-primary carga-docs" data-toggle="modal" data-target="#ModalCargaFactura">Cargar Documentos</button>
  • Agrega en la ventana modal un par de div para poner ahí el número de factura
  • Escucha clic en el botón para actualizar el número

// Escuchar clics en botón
$(document).on('click', '.carga-docs', function() {
    // Obtener texto de primera celda (Número de factura)
    let num = $(this).closest('tr').find('td').eq(0).text();
    // Asignar a campo en modal
    $('#numToUpload').text(num);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"></script>

<div class="col-sm-12">
    <table id="example">
        <thead>
            <tr>
                <th>Factura</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>
                    2910
                </td>
                <td>
                    <button type="button" class="btn btn-primary carga-docs" data-toggle="modal" data-target="#ModalCargaFactura">Cargar Documentos</button>
                </td>
            </tr>
        </tbody>
    </table>
</div>

<div class="modal fade bd-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" id="ModalCargaFactura" data-backdrop="static" data-keyboard="false" >
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
              <div class="modal-header" style="background: #36AD52;">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                  <span aria-hidden="true" style="color: #FFFFFF;">&times;</span>
                </button>
              </div>
              <div class="modal-body">
       <form action="" enctype="multipart/form-data">
          <div class="form-group row">
              <div class="col-sm-3 col-form-label"><b>Factura:</b></div>
              <div class="col-sm-8" id="numToUpload"></div>
              <label for="fileToUpload" class="col-sm-3 col-form-label"> Archivo XML:</label>
              <div class="col-sm-8">
                <input type="file" name="fileToUpload" id="XmlToUpload" class="btn" accept=".xml" onchange="ValidarArchivos()" required>
              </div>
                    </div>
                    <div class="form-group row">
                         <label for="pdfToUpload" class="col-sm-3 col-form-label">Archivo PDF:</label>
              <div class="col-sm-8">
              <input type="file" name="pdfToUpload" id="pdfToUpload" class="btn" accept=".pdf" onchange="ValidarArchivos()" required>
              </div>
                    </div>      
              </div>

          <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancelar</button>
            <button type="button" id="upload" class="btn btn-success">Subir Documentos</button>
          </div>
      </form>
            </div>
      <div class="upload-msg"></div>
          </div>
        </div>

En la petición AJAX agrega también el número de factura:

    const datosForm = new FormData;

    datosForm.append("XmlToUpload", ArchivoXml);
    datosForm.append("pdfToUpload", ArchivoPDF);
    // Agregar número de factura
    datosForm.append('factura', $('#numToUpload').text());

    const filePath="server.php"
    //console.log(ArchivoXml);
    $.ajax({
        type:'POST',
        cache: false,
        contentType: false,
        processData: false,
        data: datosForm,
        url:filePath
    }).done(function(data){
        alert(data);
    }).fail(function(){
        alert('El archivo no se pudo cargar');
    });

Al procesar la petición en PHP, verifica que se recibió el número de factura también y define un arreglo para devolver, con 3 propiedades, cada una representa el estado de la acción realizada:

  • factura: Verdadero si hay un número de factura
  • xml: Verdadero si se proporcionó archivo XML, no tiene error y se pudo mover a ubicación final
  • pdf: Igual que el anterior, pero archivo PDF
<?php
    // Obtén número de factura o cadena vacía
    $factura = (isset($_POST['factura'])) ? trim($_POST['factura']) : '';

    // Define el arreglo que vas a devolver
    $res = [
        'factura' => ($factura != ''),
        'xml' => (isset($_FILES["XmlToUpload"]) && $_FILES["XmlToUpload"]['error'] == 0),
        'pdf' => (isset($_FILES["pdfToUpload"]) && $_FILES["pdfToUpload"]['error'] == 0)
    ];

    // Solo si hay número de factura
    if($res['factura']) {
        // Solo si se subió archivo XML y no tuvo error
        if($res['xml']) {
            $archivo = $_FILES["XmlToUpload"]["name"];
            $ruta ="XML/";

            if(!move_uploaded_file($_FILES["XmlToUpload"]["tmp_name"], $ruta . $archivo)) {
                // Hubo error, poner propiedad en falso
                $res['xml'] = false;
            }          
        }
        // Solo si se subió archivo PDF y no tuvo error
        if($res['pdf']) {
            $archivo = $_FILES["pdfToUpload"]["name"];
            $ruta ="PDF/";

            if(!move_uploaded_file($_FILES["pdfToUpload"]["tmp_name"], $ruta . $archivo)) {
                // Hubo error, poner propiedad en falso
                $res['pdf'] = false;
            }          
        }
        // ¿Se subieron los dos archivos?
        if($res['xml'] && $res['pdf']) {
            // Aquí ejecutas la consulta para actualizar estado de factura
            // Ya tienes el número en la variable $factura
        }
    }
    // Devuelves el arreglo
    echo json_encode($res);

Importante: Deberías tener una columna para guardar el nombre de cada archivo en la tabla de facturas.

0

Tu Respuesta

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

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