Imagen de php a ajax

[cespinoza]

Buenas tardes he estado trabajando en un grid con jquery en php con ajax
el problema lo tengo al crear el grid tiene que estar una foto en cada registro
todo lo que es texto lo paso sin problemas el problema es como puedo pasar el campo que contiene la imagen que es un BLOB.!

Código:

     function generarTabla() {

                $.ajax({
                    type: "POST",
                    url: "Modelos/generarTabla",
                    //  data: JSON.stringify(parms),
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (msg) {


                        $('#tableRepa').html('<table id="tableRadios" class="display">' + msg + '</table>');
                        oTableRadio = $('#tableRadios').dataTable({
                            "bJQueryUI": true,
                            "sPaginationType": "full_numbers"

                        });
                        $("#tableRadios tbody").click(function (event) {
                            $(oTableRadio.fnSettings().aoData).each(function () {
                                $(this.nTr).removeClass('row_selected');
                            });
                            $(event.target.parentNode).addClass('row_selected');
                        });
                        $('#tableRadios tbody td').click(function () {
                            /* Get the position of the current data from the node */
                            aPosPad3 = oTableRadio.fnGetPosition(this);

                            /* Get the data array for this row */
                            aDataPad3 = oTableRadio.fnGetData(aPosPad3[0]);
                       


                        });


                    }

                });

            }

en PHP

Código PHP:

  //$vector tiene los datos de la base de datos
$vector;
echo "<th>Imagen</th>
     <th>Descripcion</th>";  

foreach($vector as $indice => $valor) { 
   echo "<td><img src=" +$valor[IMAGEN]+ "/></td>"; 
   echo "<td>"+$valor[DESC]+"</td>"; 
}
?>  
  

en esta parte es donde se creea la tabla con la infrmacion desde php

Código:

         $('#tableRepa').html('<table id="tableRadios" class="display">' + msg + '</table>');

el problema es como mandar el campo blob y que se interprete con JS


Gracias.!

[xIamAlex]

No necesitas hacer nada con JavaScript, ya que al mandar el texto de la imagen (BLOB) mandas es el MIME content de la misma, así que deberás hacer lo siguiente:

1 - Obtener el MIME (BLOB) de la base de datos.
2 - Con PHP crea un header que especifique el tipo de MIME content que el archivo mostrará, luego parsea el Blob.

No me acuerdo cuales son las funciones para hacerlo, (creo que son createimagefromjpeg o algo así, de todas formas las puedes encontrar en el manual)

[Dradi7]

yo creo que mas que enviar un campo blob al js no vas a poder, seria mejor que crees aparte un archivo php en donde te devuelva una imagen y lo pasas como parámetro el id

ejemplo.

<img src="mostrarimagen.php?id=4" />

en el foro de php vas a encontrar múltiples ejemplos de como poder realizar esto

Saludos

[xIamAlex]

Edito: mi respuesta se basaba en que ya habías pasado la imagen, pero como veo que al parecer lo que no puedes hacer es eso, pues te recomiendo que subas la imagen en físico al servidor y así te evitas tantos problemas, puedes usar un input de tipo file pero el problema radica en hacer el ajax, de todas maneras aquí el ajax está demás, ya que enviar una imagen tomará el mismo tiempo, lo más cómodo sería crear un form que te mande todo y luego en el servidor decides si guardar la imagen en la base de datos o ponerla en algún sitio en el servidor.

Con respecto a lo último te doy sugerencias:

1 - Si necesitas hacer procesos con la imagen, como recortar, colorear, etc, se hará cómodo tenerlo en la base datos.

2 - Si solo necesitas es la imagen y punto sin hacer más nada solo vincularla, pues no vale la pena tenerla allí, porque el proceso sería más lento al tener que consultar la imagen completa, para eso súbela a algún sitio y nada más tendrás que guardar es su dirección (o mejor dicho nada dependiendo de como diseñes el sistema). Esto es para mejorar el rendimiento y banda ancha de la página.

Saludos

[cespinoza]

Gracias por las respuestas

Encuanto atu respuesta Dradi7 podria usarlo esto para llenar la tabla

Foto Registro1
Foto2 Registro2
Foto3 Registro3

tendria que hacer un <img src="mostrarimagen.php?id=4" />
por cada registro que tenga mi query ?


y en cuanta a xIamAlex

la primer opcion que me diste puede funcionar?

Gracias.!

[xIamAlex]

No estoy del todo claro con respecto a tu duda, ¿La imagen dónde queda, en el servidor, en la base de datos, etc?, porque de ser en la base de datos la estructura sería la siguiente:

Id | Dato1 | Dato2 | Dato3 | Imagen

Dónde imagen es el content-type del MIME de tu imagen, en caso de que NO USES EL MIME, sino que lo guardaste en el servidor, no necesitarías un campo para la imagen, ya que podrías renombrarla con el id y hacer algo como:

<img src="imagenes/<?php echo $Datos_de_consulta['Id']; ?>.jpg" />

A menos que sean de varios formatos, podrías hacer un campo adicional con la extensión del archivo:

<img src="imagenes/<?php echo $Datos_de_consulta['Id']. $Datos_de_consulta['tipo_imagen']; ?>" />

Si quieres obtener el content-type de la imagen que subiste al servidor, pues, haz esto:

$Imagen = file_get_contents($_FILES['foto']['tmp_name']);

Ya con la variable $Imagen tienes el contenido ASCII de tu imagen que es la que estructura su forma binaria, la insertas en la base de datos y luego para mostrarla en un archivo php aparte, pones:

Código PHP:

  <?php

// ... Script donde consultes el content de la base de datos.

header('Content-Type: image/jpeg'); // Puede variar ten esto en mente

echo $Datos_de_consulta['Imagen']

?>