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.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...
