By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
429,327 Members | 2,627 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 429,327 IT Pros & Developers. It's quick & easy.

display images from db using jquery

pradeepjain
100+
P: 563
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>
Expand|Select|Wrap|Line Numbers
  1. <?php
  2.  
  3. include_once('../db.php');
  4.  
  5.         $sql = "SELECT image FROM rop_images WHERE Patient_id='".$_GET['id']."'";
  6.  
  7.         $result = mysql_query("$sql") or die("Invalid query: " . mysql_error());
  8.  
  9.         header("Content-type: image/jpeg");
  10.         $test=mysql_result($result,0);
  11.  
  12. $desired_width  =  80;
  13. $desired_height  =  80;
  14.  
  15. $im  =  imagecreatefromstring($test);
  16. $new  =  imagecreatetruecolor($desired_width,  $desired_height);
  17.  
  18. $x  =  imagesx($im);
  19. $y  =  imagesy($im);
  20.  
  21. imagecopyresampled($new,  $im,  0,  0,  0,  0,  $desired_width,  $desired_height,  $x,  $y);
  22.  
  23. imagedestroy($im);
  24. header("cache-Control: no-cache, must-revalidate"); // HTTP/1.1
  25. header("Expires: Mon, 26 Jul 1997 05:00:00 GMT"); // Date in the past 
  26. header('Content-type:  image/jpeg');
  27. imagejpeg($new,  NULL,  85);
  28.  
  29. imagedestroy($new);
  30. //      echo $test;
  31.  
  32.         mysql_close($link);
  33. ?>
  34.  
Mar 11 '10 #1
Share this Question
Share on Google+
8 Replies


Atli
Expert 5K+
P: 5,058
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.
Expand|Select|Wrap|Line Numbers
  1. <img src="getimg.php?parent_id=1&size=32" alt="32 px thumb">
  2. <img src="getimg.php?parent_id=1&size=64" alt="64 px thumb">
  3. <img src="getimg.php?parent_id=1&size=128" alt="128 px thumb">
Expand|Select|Wrap|Line Numbers
  1. <?php
  2. $parent_id = (int)$_GET['parent_id'];
  3. $thumb_size = (int)$_GET['size'];
  4.  
  5. if($parent_id > 0 && $thumb_size > 0)
  6. {
  7.     $sql = "SELECT `data`, `mime` 
  8.             FROM `thumbs`
  9.             WHERE `parent_id = {$parent_id}
  10.             ADN   `size` = {$thumb_size}"
  11.  
  12.     // etc...
  13. }
  14. ?>
See what I mean?
Mar 11 '10 #2

pradeepjain
100+
P: 563
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) .
Mar 11 '10 #3

pradeepjain
100+
P: 563
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
Expand|Select|Wrap|Line Numbers
  1. ("#dropdown").change(function(){
  2.                 $.post("change.php",{ state:$("#id").val()} ,function(data){
  3.  
  4. // get the count count(array) so that we know number of images .
  5. //loop through the array and print the images
  6. // how do i do the previous 2 steps ? 
  7. // instead of state:$("#id").val() can i pass value like state: <?php echo $id ?> ??
  8. });
  9.     });
Mar 12 '10 #4

pradeepjain
100+
P: 563
no help on this problem ?
Mar 15 '10 #5

pradeepjain
100+
P: 563
Expand|Select|Wrap|Line Numbers
  1. $.post("/diabetes/ropimages/getcount.php",{pid:$("#patient_id").val()} ,function(data1){
  2. //alert(data1);
  3. var count = data1;
  4. var pid = $("#patient_id").val();
  5. var rid;
  6. for( var i = 1 ; i <= count ; i++)
  7. {
  8. var link ='<img src="/diabetes/ropimages/thumbpicdisplay.php?pid=+pid+&rid=1" />';
  9. $("#content1").empty().html(link);
  10. }
  11. });
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
Mar 15 '10 #6

pradeepjain
100+
P: 563
i finally wrote code like this..



Expand|Select|Wrap|Line Numbers
  1. $.getJSON("/diabetes/ropimages/getcount.php",{pid:$("#patient_id").val()} ,function(data1){
  2.  
  3. var i;
  4. var count = data1.count;
  5.  
  6. var start = data1.start;
  7.  
  8. var pid = $("#patient_id").val();
  9.  
  10.  
  11. for(i = start ; i <= count ; i++)
  12. {
  13. var link ='<a href="/diabetes/ropimages/origpicdisplay.php?pid='+pid+'&rid='+i+'"><img src="/diabetes/ropimages/thumbpicdisplay.php?pid='+pid+'&rid='+i+'"/><a>';
  14. alert(link);
  15. if(i > start)
  16. {
  17. $("#content1").append(link);
  18. }
  19. else{
  20. $("#content1").empty().html(link);
  21. }
  22.  
  23. }
  24. },"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.
Mar 15 '10 #7

Markus
Expert 5K+
P: 6,050
Moving to JavaScript.
Mar 15 '10 #8

pradeepjain
100+
P: 563
finally i solved the problem by writing code like this.

Expand|Select|Wrap|Line Numbers
  1. $("#patient_id").change(function(){
  2.  
  3. $.getJSON("/diabetes/ropimages/getcount.php",{pid:$("#patient_id").val()} ,function(data1){
  4.  
  5.  
  6. var link = "";
  7.  
  8. var count = parseInt(data1.count);
  9. var start = parseInt(data1.start);
  10. var pid = $("#patient_id").val();
  11.  
  12.  
  13. count = parseInt(count)+parseInt(start);
  14.  
  15. if(count > 0){
  16. for(var i= parseInt(start); i < parseInt(count); i++)
  17. {
  18.  
  19. link ='<a href="/diabetes/ropimages/origpicdisplay.php?pid='+pid+'&rid='+i+'"><img src="/diabetes/ropimages/thumbpicdisplay.php?pid='+pid+'&rid='+i+'"/><a>';
  20.  
  21. if(i > start){ $("#content1").append(link);}
  22.  
  23. else{ $("#content1").empty().html(link);}
  24. }
  25. }
  26. else{ $("#content1").html("No Images uploaded");}
  27. },"Json");
  28.  
  29. });
Mar 17 '10 #9

Post your reply

Sign in to post your reply or Sign up for a free account.