Start New Discussion within our Web Development Community

hi i made an image slider. it loads all the images from the data base using php and for sliding and timing intervals i used javascrpt and ajax.
through back end of the systems can edit these images and upload new , update and delete.
i want to reflect the changes made in the back end straight away in the front end. so i used ajax request.
but unfortunately it doesn't work :(
this is the first time i'm doing such a thing using ajax. so there maybe errors and in-accurateness. I used ajax to refresh a div. so that div contains everything including php, ajax, javascript. an external file contains function which refreshes the whole thing.

i used firebug and when i check the code i can see the changes i applied through the front end. but the slider doesn't reflect those changes. response is also working as i can see it in firebug console. (also i used an alert() - it worked too).. i don't know how can fix this.. even why it doesn't work.
i will post the content inside that div.

<div id="imageSlider" style="display: none;">
<script type='text/javascript'>

var newImage=new Array();
var imageTime=new Array();

	//$ad_con = new Ad_Controller();
	$resutls1 = Ad_Controller::play_ads($_SESSION['level']);
	else if($lan==2)
	else if($lan==3)
	foreach($resutls1 as $rec1){
		else if($lan==2)
		else if($lan==3)
		foreach($resutls1 as $rec1){

var bottom = 0;
var padding = 5;
var X = 5;
var Y = 0;

function dropMyPopup() {
 Y++; Y++; 
 if( Y > bottom ){return;}
 document.getElementById("styled_popup") = Y + "px";
 setTimeout("dropMyPopup()", 25);

function fireMyPopup(img) {
 var scrolledY;
 if( self.pageYOffset ) {
   scrolledY = self.pageYOffset;
 } else if( document.documentElement && document.documentElement.scrollTop ) {
   scrolledY = document.documentElement.scrollTop;
 } else if( document.body ) {
   scrolledY = document.body.scrollTop;

 var centerY;
 if( self.innerHeight ) {
   centerY = self.innerHeight;
 } else if( document.documentElement && document.documentElement.clientHeight ) {
   centerY = document.documentElement.clientHeight;
 } else if( document.body ) {
   centerY = document.body.clientHeight;

 // Don't forget to subtract popup's height! ( 300 in our case )

 bottom = scrolledY + centerY - padding - ((centerY*30)/100) -((centerY*16)/100);
 Y = scrolledY;

 document.getElementById("styled_popup").style.right = X + "px";
 document.getElementById("styled_popup").style.display = "block";

document.getElementById('styled_popup').style.backgroundImage = "url("+dir+newImage[img]+")";


  var dtime=parseInt(imageTime[img])+7000;
   setTimeout("styledPopupClose()", dtime);
		var ddtime=dtime+5000;
	else if(img==(newImage.length)){
	//Y = 0; 
	 setTimeout(function(){fireMyPopup(0)}, 5000);

function styledPopupClose() {
 document.getElementById("styled_popup").style.display = "none";
 Y = bottom; // if it was closed, make sure extra computations are done in dropMyPopup()