display images from db using jquery

[pradeepjain]

hii,
I have 3 images for a single id like 00024 in the DB. when ever the user selects the ID from the drop down .all the 3 images must be displayed . how do i do this?

this is the image script i use and display images like
<img src='/diabetes/visitimages/thumbpicdisplay .php?id=<?php echo $id ?></img>

<?php

include_once('../db.php');

        $sql = "SELECT image FROM rop_images WHERE Patient_id='".$_GET['id']."'";

        $result = mysql_query("$sql") or die("Invalid query: " . mysql_error());

        header("Content-type: image/jpeg");
        $test=mysql_result($result,0);

$desired_width  =  80;
$desired_height  =  80;

$im  =  imagecreatefromstring($test);
$new  =  imagecreatetruecolor($desired_width,  $desired_height);

$x  =  imagesx($im);
$y  =  imagesy($im);

imagecopyresampled($new,  $im,  0,  0,  0,  0,  $desired_width,  $desired_height,  $x,  $y);

imagedestroy($im);
header("cache-Control: no-cache, must-revalidate"); // HTTP/1.1
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT"); // Date in the past 
header('Content-type:  image/jpeg');
imagejpeg($new,  NULL,  85);

imagedestroy($new);
//      echo $test;

        mysql_close($link);
?>

[Atli]

Hey.

How do you differentiate between the three images?

Generally, though, you would just pass ALL the identifiers required to query the specific image from the database, and have the script fetch and display it.
[code=html]<img src="getimg.php ?parent_id=1&si ze=32" alt="32 px thumb">
<img src="getimg.php ?parent_id=1&si ze=64" alt="64 px thumb">
<img src="getimg.php ?parent_id=1&si ze=128" alt="128 px thumb">[/code]
[code=php]<?php
$parent_id = (int)$_GET['parent_id'];
$thumb_size = (int)$_GET['size'];

if($parent_id > 0 && $thumb_size > 0)
{
$sql = "SELECT `data`, `mime`
FROM `thumbs`
WHERE `parent_id = {$parent_id}
ADN `size` = {$thumb_size}"

// etc...
}
?>[/code]
See what I mean?

[pradeepjain]

yeah that was the way i was doing .

Now the requirement is that we have to display all the images from Db regarding a Id.So we have a dropdown with all the Id's . when the user changes the ID the images from get displayed .
since i am using jquery . i asked this question how do i do using jquery and another problem is that . there can be any number of images corresponding to a ID say ( 0006) .

[pradeepjain]

i have a small idea on this . please help me executing this using jquery.

when ever the dropdown is changed , i call a function and i fetch the rowid(auto incremented value) and actual id from the Db . and make it into a array in a php file and then return it back in a array to the jquery .

like

("#dropdown").change(function(){
                $.post("change.php",{ state:$("#id").val()} ,function(data){

// get the count count(array) so that we know number of images .
//loop through the array and print the images
// how do i do the previous 2 steps ? 
// instead of state:$("#id").val() can i pass value like state: <?php echo $id ?> ??
});
    });

[pradeepjain]

no help on this problem ?

[pradeepjain]

$.post("/diabetes/ropimages/getcount.php",{pid:$("#patient_id").val()} ,function(data1){
//alert(data1);
var count = data1;
var pid = $("#patient_id").val();
var rid;
for( var i = 1 ; i <= count ; i++)
{
var link ='<img src="/diabetes/ropimages/thumbpicdisplay.php?pid=+pid+&rid=1" />';
$("#content1").empty().html(link);
}
});

i am trying to pass pid value in url ..but its taking directly as +pid+ as value ..how do i give it the value of pid. and how do i print 3 images in a div ? like the one in code

[pradeepjain]

i finally wrote code like this..

$.getJSON("/diabetes/ropimages/getcount.php",{pid:$("#patient_id").val()} ,function(data1){

var i;
var count = data1.count;

var start = data1.start;

var pid = $("#patient_id").val();


for(i = start ; i <= count ; i++)
{
var link ='<a href="/diabetes/ropimages/origpicdisplay.php?pid='+pid+'&rid='+i+'"><img src="/diabetes/ropimages/thumbpicdisplay.php?pid='+pid+'&rid='+i+'"/><a>';
alert(link);
if(i > start)
{
$("#content1").append(link);
}
else{
$("#content1").empty().html(link);
}

}
},"Json");

for the 1st loop it works ..then it stops printing the images...can u just tell me whts the problem? its not coming inside the loop itself, i checked giving the alert statement inside the loop.

[Markus]

Moving to JavaScript.

[pradeepjain]

finally i solved the problem by writing code like this.

$("#patient_id").change(function(){

$.getJSON("/diabetes/ropimages/getcount.php",{pid:$("#patient_id").val()} ,function(data1){


var link = "";

var count = parseInt(data1.count);
var start = parseInt(data1.start);
var pid = $("#patient_id").val();


count = parseInt(count)+parseInt(start);

if(count > 0){
for(var i= parseInt(start); i < parseInt(count); i++)
{

link ='<a href="/diabetes/ropimages/origpicdisplay.php?pid='+pid+'&rid='+i+'"><img src="/diabetes/ropimages/thumbpicdisplay.php?pid='+pid+'&rid='+i+'"/><a>';

if(i > start){ $("#content1").append(link);}

else{ $("#content1").empty().html(link);}
}
}
else{ $("#content1").html("No Images uploaded");}
},"Json");

});