1

MOSTRARCARRO.PHP

Muestro una serie de productos que se encuentran en $carrito7. Hay un botón para eliminar por cada producto. Cuando pulso el botón, quiero que lo elimine a través de Ajax (Ve al comentario escrito en mayúsculas, en ese input estoy serializando el array carrito7).

    //Muestro una tabla con todos los productos que se añadieron al carrito

    echo "<form action='eliminarFotografia.php' method='post' name='formulario'>";
    echo "<table><tr><th>NombreFoto</th><th>Precio</th><th>Cantidad</th><th>Subtotal</th></tr>";
    $numProductos=count($carrito7);
    //Calculo el precio total de la compra
    for($i=0;$i<$numProductos;$i++){
        $total+=$carrito7[$i][4]; //precio total
    }

    for($i=0;$i<$numProductos;$i++){
        echo "<tr>";
        echo "<td>".$carrito7[$i][1]."</td>";
        echo "<td>".$carrito7[$i][2]."</td>";
        echo "<td><input type='number' name='cantidad' value='".$carrito7[$i][3]."' min='0'></td>";
        echo "<td>".$carrito7[$i][4]."</td>";

        //Eliminar un producto del carro
        //DESDE EL ID DE ESTE INPUT RECOJO LA VARIABLE CARRITO7 QUE QUIERO ENVIAR A TRAVÉS DE AJAX. ES UN ARRAY MULTIDIMENSIONAL
        echo "<td><input type='button' name='eliminar' id='".serialize($carrito7)."' value='Eliminar' onclick='eliminarFoto(event)'></td>";
        //echo "<input type='hidden' name='carrito7' value='".serialize($carrito7)."'>"; //Desde aqui paso la variable carrito al ajax para luego sacar de aqui el producto a eliminar
        echo "</tr>";
    }
        echo "<th colspan='2'>Total:</th>";  
        echo "<td>".$total."</td>";
        echo "<input type='hidden' name='total' value='".$total."'>"; 

        //Realizar la compra
        echo "<input type='submit' name='comprar' value='Comprar'>";
        echo "<div id='mensaje'></div>";

        echo "</form>";

}

A través del código que aparece debajo envío la información a través de Ajax. Envío el "ID" del producto a eliminar y la variable carrito7. La variable carrito7 contiene un array multidimensional. En el código de arriba se puede ver que éste array lo estoy serializando para poder enviarlo a través de ajax.

<script>

//Elimino producto del carrito
function eliminarFoto(event){

    var id=event.target.id; //Recojo el ID del producto
    var carrito7=$('#carrito7').val();  //Recojo la variable carrito7

    var dataString='id='+id+'&carrito7='+carrito7;

    jQuery.ajax({
        url: "eliminarFotografia.php", 
        data: dataString,
        type: "POST",
        success: function (data) {
            $('#mensaje').html(data);
        },

        error: function () {}   
     });
 }
</script>

ELIMINARPRODUCTO.PHP

Cuando llega al archivo PHP desde el cual voy a recibir la respuesta, deserializo el array para poder recorrerlo y eliminar el producto deseado.

<?php

$id=$_POST['id'];
$carrito7=$_POST['carrito7'];

$carritoDes=unserialize($carrito7); //deserializo la variable carrito7 y lo guardo en la variable carritoDes

//Recorro carritoDes para eliminar el producto
for($i=0;$i<3;$i++){
   if($carritoDes[$i][0]==$id){
       unset($carrito7[$i]);
   }

}
$mensaje=$id;
echo $mensaje;

?>

Y bueno, espero haberme explicado claramente. Ésto es lo que se me ha ocurrido hacer para poder eliminar el producto y enviar el array. Obviamente es erróneo. Me da este fallo:

unserialize(): Error at offset 0 of 9 bytes in C:\xampp\htdocs\ProyectoDaw2\eliminarFotografia.php on line 5
13
  • 1
    Posible duplicado de Enviar array multidimensional de PHP a jQuery (¿ajax?)
    – GDP
    Commented el 18 abr. 2018 a las 9:13
  • Ya lo he leído, pero tengo la esperanza de no tener que tirar de JSON y que haya otra forma de hacerlo, por ejemplo serializando el array. Si alguien me dice que con Json es la única manera de hacerlo, pues investigaré por ahí.
    – Inca
    Commented el 18 abr. 2018 a las 9:16
  • La forma nativa de pasar datos en javascript es usando JSON ("notación de javascript" es el significado). "Serializar" mediante esa función funciona únicamente entre PHP-PHP sin complicar el código. Voy a mirar detenidamente tu pregunta para ver en qué puedo ayudar. Commented el 18 abr. 2018 a las 9:18
  • Echale un ojo tambien a esta otra respuesta
    – GDP
    Commented el 18 abr. 2018 a las 9:19
  • Bien, ya he leído la pregunta y parece que no tiene mucho que ver el sentido PHP -> JS, si no el inverso. Commented el 18 abr. 2018 a las 9:21

1 respuesta 1

1

En resumen tienes dos problemas:

  • No usar htmlspecialchars() para enviar datos de PHP al navegador en HTML.
  • No usar encodeURI() para codificar correctamente los datos POST enviados al PHP (que solucionaremos de otra manera más elegante).

Otro de los problemas que tienes es que estás repitiendo un elemento cuya id es el valor serializado de $carrito7 por cada fila de resultado, cuando debería estar una única vez en el formulario (en general, en todo el HTML).

El uso de htmlspecialchars() para convertir datos en HTML es importante, por lo que no puedes agregarlo de manera directa al HTML sin que una comilla u otro carácter dentro de los datos serializados rompa tu HTML.

El PHP del formulario podría quedar así:

<form action="eliminarFotografia.php" method="post" name="formulario">
    <input type="hidden" id="carrito7"
      value="<?= htmlspecialchars(serialize($carrito7)) ?>" />
    <table>
        <tr>
            <th>NombreFoto</th>
            <th>Precio</th>
            <th>Cantidad</th>
            <th>Subtotal</th>
        </tr>
    <?php
// Muestro una tabla con todos los productos que se añadieron al carrito
$numProductos = count($carrito7);
for($i = 0, $total = 0; $i < $numProductos; $i++){
    // Calculo el precio total de la compra
    $total += $carrito7[$i][4]; //precio total
?>        <tr>
            <td><?= htmlspecialchars($carrito7[$i][1])?></td>
            <td><?= htmlspecialchars($carrito7[$i][2])?></td>
            <td><input type="number" name="cantidad" value="<?= htmlspecialchars($carrito7[$i][3]) ?>." min="0"></td>
            <td><?= htmlspecialchars($carrito7[$i][4])?></td>
            <td><input type='button' name="eliminar" value="Eliminar"
              data-id="<?= htmlspecialchars($carrito7[$i][0]) ?>"
              onclick="eliminarFoto(event)"></td>
        </tr>
<?php
}
?>        <tr>
            <th colspan="2">Total:</th>
            <td><?= $total ?></td>
        </tr>
    </table>
    <input type='hidden' name='total' value="<?= htmlspecialchars($total) ?>" />
    <input type='submit' name='comprar' value='Comprar'>
    <div id='mensaje'></div>
</form>

La parte más importante de la que te he hablado es:

<input type="hidden" id="carrito7"
  value="<?= htmlspecialchars(serialize($carrito7)) ?>" />

Fíjate cómo uso htmlspecialchars() para convertir en entidades HTML cualquier carácter que pudiera romper el HTML.

También he hecho uso de los atributos de datos data-* para guardar en el botón el identificador del elemento pulsado.

Por otro lado, también he simplificado tu código de Javascript para enviar los datos por POST de manera "nativa" sin montar una URL incorrecta (sin usar encodeURI()):

<script>

//Elimino producto del carrito
function eliminarFoto(event){
    /* Lo siguiente ya no se usa porque en "id" no se almacena nada */
    /*var id = event.target.id; //Recojo el ID del producto*/
    /* Esto no es necesario y lo segundo está mal formado */
    /*var carrito7=$('#carrito7').val();  //Recojo la variable carrito7
    var dataString='id='+id+'&carrito7='+carrito7;*/

    /* Enviamos en "data" los datos de la siguiente manera */
    jQuery.ajax({
        url: "eliminarFotografia.php",
        /* Manera más elegante de enviar los datos: */
        data: {
          id: event.target.dataset.id,
          carrito7: $('#carrito7').val(),
        },
        type: "POST",
        success: function (data) {
            $('#mensaje').html(data);
        },
        error: function () {}   
     });
 }
</script>

Ahora los datos han debido llegar correctamente a tu PHP. Te dejo las modificaciones que he hecho en tu PHP para que éste funciona correctamente ya que, por ejemplo, estás intentando eliminar un índice de una cadena de texto en vez de los datos deserializados:

<pre style="font-size: 70%;"><?php
/* Convertimos en entero ya que no podemos eliminar un índice numérico con una cadena */
$id = intval($_POST['id']);
$carritoDes = unserialize($_POST['carrito7']); //deserializo la variable carrito7 y lo guardo en la variable carritoDes

/* Mostramos, para depurar, que todo ha llegado bien */
var_export($carritoDes);
//Recorro carritoDes para eliminar el producto
foreach ($carritoDes as $i => $datos) {
   if($datos[0] == $id) {
       /* Debemos quitar el elemento de los datos deserializados */
       unset($carritoDes[$i]);
   }
}
/* Mostramos, para depurar, que se ha borrado el elemento deseado */
var_export($carritoDes);
?></pre>
<p>ID recibido: <?= $id ?></p>

Te he dejado la prueba de concepto que he usado en el siguiente gist: https://gist.github.com/ojgarciab/05ad1dbb7ff371c1ba3bb70f9325cba7

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.