asked on

php with javascript

I am trying to embed php code inside javascript but for some reason it does not seem to work. The code is as under

var slideshowcontent=new Array()
<?PHP
$sql="SELECT * FROM featured ORDER BY id ASC";
$result = mysql_query($sql);
$count = mysql_num_rows($result);
for ($i=0; $i<$count; $i++) {
$image = mysql_fetch_assoc($result);
$featprod = getProduct($image['prodid']);
$brand = getBrand($featprod['manid']);
$title = $brand['name']."-".$featprod['title'];
$newtitle = str_replace(" ", "-", $title);
echo <<<HTML
slideshowcontent[{$i}]=["{$promoimages}/{$image['image']}", "/product/{$image['prodid']}/{$newtitle}, ""]
HTML;
}
?>

The code generated should look like this

slideshowcontent[0]=["/images/promo1.jpg", "/product/206/Hitec-RoboNova-RTW-w/Romocon-IR-Set", ""]
slideshowcontent[1]=["/images/promo2.jpg", "", ""]
slideshowcontent[2]=["/images/promo3.jpg", "/product/205/Traxxas-Villain-EX-DeepV-RTR-Racer-14.4V", ""]
slideshowcontent[3]=["/images/promo4.jpg", "/product/26/Traxxas-Revo-3.3-4WD-Nitro-Monster-Truck-RTR", ""]
slideshowcontent[4]=["/images/promo5.jpg", "/product/3272/Hobbyzone-Super-Cub-RTF-Electric", ""]

The code can be seen in the following page http://www.nexthobbies.com/index2.php. The code seems to be generated correctly buy it does not seem to work. Any help will be appreciated. The actual behaviour of this page can be found at http://www.nexthobbies.com/index.php

hielo

Try this:

<?php
$sql="SELECT * FROM featured ORDER BY id ASC";
$result = mysql_query($sql);
$count = mysql_num_rows($result);
 
while($image = mysql_fetch_assoc($result)){
	$featprod = getProduct($image['prodid']);
	$brand = getBrand($image['manid']);
	$title = $image['name']."-".$image['title'];
	$newtitle = str_replace(" ", "-", $title); 
echo <<<HTML
slideshowcontent[slideshowcontent.length]=["{$promoimages}/{$image['image']}", "/product/{$image['prodid']}/{$newtitle}, ""];
HTML;
}
?>

Open in new window

SOLUTION

hielo

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

sulentho

ASKER

This is the entire JS code as I have it now. I tried both your ways it does not seem to work. Thanks for the help

<script type="text/javascript">
 
/***********************************************
* Translucent Slideshow script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
 
var trans_width='662px' //slideshow width
var trans_height='290px' //slideshow height
var pause=4000 //SET PAUSE BETWEEN SLIDE (3000=3 seconds)
var degree=70 //animation speed. Greater is faster.
 
var slideshowcontent=new Array()
<?php
$sql="SELECT * FROM featured ORDER BY id ASC";
$result = mysql_query($sql);
$count = mysql_num_rows($result);
 
while($image = mysql_fetch_assoc($result)){
	$featprod = getProduct($image['prodid']);
	$brand = getBrand($featprod['manid']);
	$title = $image['name']."-".$featprod['title'];
	$newtitle = str_replace(" ", "-", $title); 
print <<<HTML
slideshowcontent[$i]=["{$promoimages}/{$image['image']}", "/product/{$image['prodid']}/{$newtitle}, ""];
HTML;
++$i;
}
?>
 
////NO need to edit beyond here/////////////
 
var bgcolor='white'
 
var imageholder=new Array()
for (i=0;i<slideshowcontent.length;i++){
imageholder[i]=new Image()
imageholder[i].src=slideshowcontent[i][0]
}
 
var ie4=document.all
var dom=document.getElementById&&navigator.userAgent.indexOf("Opera")==-1
 
if (ie4||dom)
document.write('<div style="position:relative;width:'+trans_width+';height:'+trans_height+';overflow:hidden"><div id="canvas0" style="position:absolute;background-color:'+bgcolor+';width:'+trans_width+';height:'+trans_height+';left:-'+trans_width+';filter:alpha(opacity=100);-moz-opacity:1.0;"></div><div id="canvas1" style="position:absolute;background-color:'+bgcolor+';width:'+trans_width+';height:'+trans_height+';left:-'+trans_width+';filter:alpha(opacity=100);-moz-opacity:1.0;"></div></div>')
else if (document.layers){
document.write('<ilayer id=tickernsmain visibility=hide width='+trans_width+' height='+trans_height+' bgColor='+bgcolor+'><layer id=tickernssub width='+trans_width+' height='+trans_height+' left=0 top=0>'+'<img src="'+slideshowcontent[0][0]+'"></layer></ilayer>')
}
 
var curpos=trans_width*(-1)
var curcanvas="canvas0"
var curindex=0
var nextindex=1
 
function getslidehtml(theslide){
var slidehtml=""
if (theslide[1]!="")
slidehtml='<a href="'+theslide[1]+'" target="'+theslide[2]+'">'
slidehtml+='<img src="'+theslide[0]+'" border="0">'
if (theslide[1]!="")
slidehtml+='</a>'
return slidehtml
}
 
function moveslide(){
if (curpos<0){
curpos=Math.min(curpos+degree,0)
tempobj.style.left=curpos+"px"
}
else{
clearInterval(dropslide)
if (crossobj.filters)
crossobj.filters.alpha.opacity=100
else if (crossobj.style.MozOpacity)
crossobj.style.MozOpacity=1
nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1"
tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas)
tempobj.innerHTML=getslidehtml(slideshowcontent[curindex])
nextindex=(nextindex<slideshowcontent.length-1)? nextindex+1 : 0
setTimeout("rotateslide()",pause)
}
}
 
function rotateslide(){
if (ie4||dom){
resetit(curcanvas)
crossobj=tempobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas)
crossobj.style.zIndex++
if (crossobj.filters)
document.all.canvas0.filters.alpha.opacity=document.all.canvas1.filters.alpha.opacity=100
else if (crossobj.style.MozOpacity)
document.getElementById("canvas0").style.MozOpacity=document.getElementById("canvas1").style.MozOpacity=1.0
var temp='setInterval("moveslide()",50)'
dropslide=eval(temp)
curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0"
}
else if (document.layers){
crossobj.document.write(getslidehtml(slideshowcontent[curindex]))
crossobj.document.close()
}
curindex=(curindex<slideshowcontent.length-1)? curindex+1 : 0
}
 
function jumptoslide(which){
curindex=which
rotateslide()
}
 
function resetit(what){
curpos=parseInt(trans_width)*(-1)
var crossobj=ie4? eval("document.all."+what) : document.getElementById(what)
crossobj.style.left=curpos+"px"
}
 
function startit(){
crossobj=ie4? eval("document.all."+curcanvas) : dom? document.getElementById(curcanvas) : document.tickernsmain.document.tickernssub
if (ie4||dom){
crossobj.innerHTML=getslidehtml(slideshowcontent[curindex])
rotateslide()
}
else{
document.tickernsmain.visibility='show'
curindex++
setInterval("rotateslide()",pause)
}
}
 
if (window.addEventListener)
window.addEventListener("load", startit, false)
else if (window.attachEvent)
window.attachEvent("onload", startit)
else if (ie4||dom||document.layers)
window.onload=startit
 
</script>

Open in new window

sulentho

ASKER

I have a feeling that the PHP is not being embedded in the right way to begin with and thats causing the issue. Thanks

hielo

>>This is the entire JS code as I have it now
On the posted code you are not connecting to the database. (See the code below)

>>it does not seem to work
Please realize that no one here knows what you are seeing or are familiar with your project. You need to be descriptive enough so that we can help you. You need to provide details. What exactly is not working? Are you not getting any data from the database? Are you getting data but the javascript is not working as expected? Are you getting any runtime errors?

<?php
//provide the appropriate info for your db
$link = mysql_connect('localhost', 'mysql_user', 'mysql_password') or die( mysql_error() );
 
//select the name of the database that contains the table you are querying
$db_selected = mysql_select_db('foo', $link) or die( mysql_error() );
 
$sql="SELECT * FROM featured ORDER BY id ASC";
$result = mysql_query($sql,$link) or die( mysql_error() );
 
while($image = mysql_fetch_assoc($result)){
	$featprod = getProduct($image['prodid']);
	$brand = getBrand($featprod['manid']);
	$title = $image['name']."-".$featprod['title'];
	$newtitle = str_replace(" ", "-", $title); 
print <<<HTML
slideshowcontent[$i]=["{$promoimages}/{$image['image']}", "/product/{$image['prodid']}/{$newtitle}, ""];
HTML;
++$i;
}
?>

Open in new window

sulentho

ASKER

I am providing the connection string in the php code prior the the javascript so thats not the issue. Thanks

ASKER CERTIFIED SOLUTION

sulentho

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

hielo

It's not clear what getProduct and getBrand return (array, id). For the sake of debugging, try using this only to see if you get any output from the db. If you do, paste it here so I know what fields you are working with:
<?php
$sql="SELECT * FROM featured ORDER BY id ASC";
$result = mysql_query($sql);
$count = mysql_num_rows($result);

while($row = mysql_fetch_assoc($result)){
print_r($row);
}
?>