INTELLIGENT WORK FORUMS
FOR COMPUTER PROFESSIONALS

Log In

Come Join Us!

Are you a
Computer / IT professional?
Join Tek-Tips Forums!
  • Talk With Other Members
  • Be Notified Of Responses
    To Your Posts
  • Keyword Search
  • One-Click Access To Your
    Favorite Forums
  • Automated Signatures
    On Your Posts
  • Best Of All, It's Free!

*Tek-Tips's functionality depends on members receiving e-mail. By joining you are opting in to receive e-mail.

Posting Guidelines

Promoting, selling, recruiting, coursework and thesis posting is forbidden.

Jobs

retrieve image from database and view without refreshing

retrieve image from database and view without refreshing

retrieve image from database and view without refreshing

(OP)
Hi,
I have to create a program using ajax and php(i thing it should be done in ajax.but i'm not sure.) which is connected to the database. in the program the last uploaded image in the database should be displayed. if a person wants to see older images that should be viewed without refreshing the webpage.  

i'm half way done as i connected and uploaded the images to database. but i don't know how to retrieve them and view them without refreshing the web page..

Does anyone know how to do this?
please help me will you??????
Many thanks in advance  

RE: retrieve image from database and view without refreshing

Hi

An image usually is displayed using an img HTML tag. For that the browsers generate a separate HTTP request. As far as you described the task, there is no reason to involve AJAX. Something like this should be enough :

CODE --> JavaScript

function show(what)
{
document.getElementById('displayhere').src=what.href
return false
}

CODE --> )

<img src="#" alt="" id="displayhere">
<a href="oneimage.png" onclick="return show(this)">One image</a>
<a href="otherimage.png" onclick="return show(this)">Other image</a>


Feherke.
http://feherke.github.com/

RE: retrieve image from database and view without refreshing

(OP)
thanks alot for the reply..
but how do i retrieve image from database and view it without refreshing the page?(please help me as im new to this work..)
please go through this code





    <title>laughline </title>
    <script type="text/javascript" src="prototype.js"></script>
    <script type="text/javascript">
    // <![CDATA[
   document.observe('dom:loaded', function () {
        var newsCat = document.getElementsByClassName('newsCat');
        for (var i = 0; i < newsCat.length; i++) {
            $(newsCat[i].id).onclick = function () {
                getCatPage(this.id);
            }
        }
    });
    
    function getCatPage(id) {
        var url = 'load-content.php';
        var rand   = Math.random(9999);
        var pars   = 'id=' + id + '&rand=' + rand;
        var myAjax = new Ajax.Request( url, {method: 'get', parameters: pars, onLoading: showLoad, onComplete: showResponse} );
    }
    
    function showLoad () {
        $('newsContent').style.display = 'none';
        $('newsLoading').style.display = 'block';
    }
    
    function showResponse (originalRequest) {
        var newData = originalRequest.responseText;
        $('newsLoading').style.display = 'none';
        $('newsContent').style.display = 'block';        
        $('newsContent').innerHTML = newData;
    }
    // ]]>
    </script>        
    
</head>
<body>
    <h1>Today's Laugh Lines.. </h1>
        <div id="tagLine">Laugh for a while</div>

<br />

    <div id="newsContainer">
        <div id="newsCategoriesContainer">
        <div class="newsCat" id="newsCat1">latest</div>
        <div class="newsCat" id="newsCat2">laugh Line 02</div>
        <div class="newsCat" id="newsCat3">laugh Line 03</div>
            <div class="newsCat" id="newsCat4">laugh Line 04</div>
            <div class="newsCat" id="newsCat5">laugh Line 05</div>
            <div class="newsCat" id="newsCat6">laugh Line 06</div>
            <div class="newsCat" id="newsCat7">laugh Line 07</div>
            <div class="newsCat" id="newsCat8">laugh Line 08</div>
            <div class="newsCat" id="newsCat9">laugh Line 09</div>
           
        </div>
        <div id="newsCategoriesContainer1"><div id="tagLine">Your advertisements here</div></div>
        <div id="newsLoading">Loading... <img src="images/loader.gif" title="Loading..." alt="Loading..." border="0" /></div>
        <div id="newsContent">
          <p><img src="images/pic1.gif" width="560" /></p>
      </div>
       </div>
</body>
</html>


My php page




<head>
<?php
include('config.php');

?>
    

</head>

<title>Laugh line</title>
<body>

<?php
function stringForJavascript($in_string) {
   $str = ereg_replace("[\r\n]", " \\n\\\n", $in_string);
   $str = ereg_replace('"', '\\"', $str);
   return $str;
}
switch($_GET['id']) {
    case 'newsCat1':
        $content = '(my LATEST IMAGE SHOULD BE CALLED HERE)';
        break;
    case 'newsCat2':
        $content = '(my 2ND LATEST IMAGE SHOULD BE CALLED HERE)';';
        break;
    case 'newsCat3':
        $content = 'Laughline 3.';
        break;
    case 'newsCat4':
        $content = 'Laughline 4.';
        break;
    case 'newsCat5':
        $content = 'Laughline 5.';
        break;
    case 'newsCat6':
        $content = 'Laughline 6.';
        break;
    case 'newsCat7':
        $content = 'Laughline 7.';
        break;
    case 'newsCat8':
        $content = 'Laughline 8.';
        break;
    case 'newsCat9':
        $content = 'Laughline 9.';
        break;
    case 'newsCat10':
        $content = 'Laughline 10.';
        break;
    case 'newsCat11':
        $content = 'Laughline 11.';
        break;
    case 'newsCat12':
        $content = 'Laughline 12.';
        break;
    default:
        $content = 'There was an error.';

}
print stringForJavascript($content);
usleep(600000);
?>
</body>

PLS help mee...
 

RE: retrieve image from database and view without refreshing

Create a seperate page in your webfolder called GETIMAGES.PHP or whatever you like put the following code in it...

<?php
mysql_connect("yourdatabaseserver","username","password");
mysql_select_db("yourdatabase");
$image = stripslashes($_REQUEST[imageid]);
$rs = mysql_query("select FIELDNAME from TABLENAME where IDENTIFIER=".$image."";
$row = mysql_fetch_assoc($rs);
$imagebytes = $row[FIELDNAME];
header("Content-type: image/jpeg");
print $imagebytes;
?>


change the yourdatabaseserver, username, password, yourdatabase etc to connect to your database

change FIELDNAME, TABLENAME and IDENTIFIER (obviously) to get the image record you want

Test it works by going to h**p://yourwebsite/GETIMAGES.PHP?imageid=1

Obviously replace the 1 with an ID from your table, and you should see an image in front of you.

Then to get the image into your web page use

'<img src="h**p://yourwebsite/GETIMAGES.PHP?imageid=1"/>'

Doesn't do everything you want it to, but it gets the image out of the database

Red Flag This Post

Please let us know here why this post is inappropriate. Reasons such as off-topic, duplicates, flames, illegal, vulgar, or students posting their homework.

Red Flag Submitted

Thank you for helping keep Tek-Tips Forums free from inappropriate posts.
The Tek-Tips staff will check this out and take appropriate action.

Reply To This Thread

Posting in the Tek-Tips forums is a member-only feature.

Click Here to join Tek-Tips and talk with other members!

Resources

Close Box

Join Tek-Tips® Today!

Join your peers on the Internet's largest technical computer professional community.
It's easy to join and it's free.

Here's Why Members Love Tek-Tips Forums:

Register now while it's still free!

Already a member? Close this window and log in.

Join Us             Close