Jump to content

meomike2000

Members
 View Profile  See their activity

  • Posts

    171

  • Joined

  • Last visited

    Never

 Content Type 

Posts posted by meomike2000

    [SOLVED] need help creating variable that will increment inside a for() loop......

    in Javascript Help

    Posted

    no i can create the div and and assign them an id just fine.....

     

    i want to be able to select the div with a dblclick and each user will have a diff amount of divs on the page,,,,  some have more data entries than others.......

     

    i create the div with a for() loop using a counter like so

     

    counter = 0;

    for() {

    document.createElement('div' + counter);

    counter++;

    }

     

    now i need a way to document.getElementById('div' + counter);

    i need to

    increment_this =  document.getElementById('div' + counter);

     

    hope this help to understand what i need.....

    [SOLVED] need help creating variable that will increment inside a for() loop......

    in Javascript Help

    Posted

    i need a way to create a loop that will create a variable that i can increment by one each time..... something like this

     

    for (var i = 1; i < source.length; i++) {

          var increment_this = document.getElementById('this_element' + i);

    }

     

    what i am trying to accomplish is that i have a function that uses dom to create <div>

    to hold some info from database.... this is random depending on the user so i use a for() loop to increment the id of the new <div>.... i want to be able to double click on the div itself to toggle that to another function that will change what is inside that div from what is being shown........ kind of like an edit in place....... i only need to know how to do the above incrementation.......

     

    thanks mike.

    DOM/JS - Background Images

    in Javascript Help

    Posted

    try something like this maybe.

     

    not sure if this will work for you or not. but that is a modified version of how i assign my back ground image, only with a for loop. you may want to add a delay in there somehow or it will go very fast.....

     

    not sure if you will need the index counter or not. you could us i for that but i always get an extra what ever it is i am trying to assign at the end of the loop, only the img would be null.......???????????

     

    hope this helps,

    mike......

     

    var index = 1;
for(var i=0; i < document.images.length; i++) {
    var img = null;
    img = document.images[index];
    var self = bckgrnd;
    var body = document.getElementById('body');
    body.background = img;
    index++;
}

    have a question, hope somebody can help......

    in Javascript Help

    Posted

    ok i am fairly new to ajax and java script...... only got a few weeks under my belt.....

     

    so here is the situation.....

    the ajax script that does the request is called Ajax();

    i have a script that gets a set of id # from a database via php....

    this script is a singleton ie starts like this var getids = new function(){ };.......

    inside that script after the ajax.doget() and data is retrieved the datahandler function uses a forloop to pass the id# one by one to another script alled (getinfo)......

    should getinfo be a singleton or a function........

    when set as a singleton i can make another call to ajax.doget() to get the info by the id. that i pass to it.....

    if set up as a function i can not seem to get it to work correctly......

     

    here are the two.....

     

    var getfriends = new function() {
this.ajax = null;
this.uid = 0;
this.Div = null;
this.br = null;

this.init = function(uid) {
	var self = getfriends;
	self.ajax = new Ajax();
	self.uid = uid;
	self.Div = document.getElementById('mainhomeleft'); 
	self.br = document.createElement('br');
	self.br.className = 'clearBoth';
	self.getf();
};

this.getf = function() {
	var self = getfriends;
	var uid = self.uid;
	var date = new Date();
	self.ajax.doGet('scripts/getfriendids.php?uid=' + uid + 'date=' + date, self.sort);
};

this.sort = function(str) {
	var self = getfriends;
	var counter = 0; 
	var index = 0;
	var br = self.br;
	var friends = str.split('|'); 
	var div = self.Div;
	if (div.firstChild) {
		div.removeChild(div.firstChild);
	}
	for (var i = 1; i < friends.length; i++) {
		var afriend = new friend();
		afriend.init(friends[index],index);
		counter++;
		index++;
		if (counter == 3) {
			div.appendChild(br);	
			counter = 0;
		}			
	}

};

this.cleanup = function() {
	var self = getfriends;
	self.ajax = null;
	self.uid = 0;
	self.Div = null;
	self.br = null;
};
};

function friend() {
this.ajax = null; 
this.Div = null;
this.id = 0;
this.index = 0;
this.name = null;
this.pic = null;
this.status = null;
this.logtime = null;
this.logdate = null;
this.isInputDisabled = false; 

this.init = function(id,index) {
	var self = this;
	this.ajax = new Ajax();
	this.id = id;
	this.index = index; 
	this.Div = document.getElementById('mainhomeleft');
	this.Div.ondblclick = self.toggle;
	this.getfriend(); 

};

this.toggle = function(e) {
	var self = this;
	var elem = null;
	if (!e) {
		e = window.event;
	}
	elem = this.getSrcElem(e);
	id = elem.id.replace(/div|span/, '');
	if (id != 'editCancel' && !this.isInputDisabled) {
		this.editId = id;
		this.showoptions();
		this.disableEnableMainWinInput(false);
	}
	else if (id == 'editCancel') {
		this.showfriend();
		this.editId = '';
		this.disableEnableMainWinInput(true);
	}
};

this.getSrcElem = function(e) {
	var ret = null;
	if (e.srcElement) {
		ret = e.srcElement;
	}
	else if (e.target) {
		ret = e.target;
	}
	while (!ret.id && ret) {
		ret = ret.parentNode;
	}
	return ret;
};

this.disableEnableMainWinInput = function(enable) {
	var self = this;
	this.isInputDisabled = !enable;
};

this.getfriend = function() {
	var self = this;
	var id = this.id;
	var date = new Date();
	self.ajax.doGet('scripts/getfriendinfo.php?id=' + id + 'date=' + date, self.sortfriend);
};	

this.sortfriend = function(str) {
	var self = this;
	var id = self.id;
	var frnd = str.split("~");
	this.name = frnd[0];
	this.pic = frnd[1];
	this.status = document.createTextNode('online');
	this.logtime = frnd[3];
	this.logdate = frnd[4];
	this.showfriend(id);
};	

this.showfriend = function() {
	var self = this;
	var div = this.Div; 
	var fddiv = null;
	var status = null; 
	var fnamediv = null;
	var fpicdiv = null;
	var fpic = null;  
	var fonlinediv = null;
	var flogtime = null;
	var flogdate = null;		 		
	fddiv = document.createElement('div');
	fddiv.id = 'friend' + self.index;
	fddiv.className = 'friend';

	fnamediv = document.createElement('div');
	fpicdiv = document.createElement('div');
	fpic = document.createElement('img');
	fpic.src = this.pic;
	fpic.className = 'fpic';
	fonlinediv = document.createElement('div');
	fonlinediv.id = 'fonlinediv';
	flogtimediv = document.createElement('div');
	flogtimediv.id = 'flogtimediv';
	flogdatediv = document.createElement('div');
	flogdatediv.id = 'flogdatediv';
	fnamediv.appendChild(document.createTextNode('testname'));
	fpicdiv.appendChild(document.createTextNode(this.id));
	fddiv.appendChild(fnamediv);
	fddiv.appendChild(fpicdiv);			
	fonlinediv.appendChild(document.createTextNode(this.status));
	flogtimediv.appendChild(document.createTextNode(this.logtime));
	flogdatediv.appendChild(document.createTextNode(this.logdate));
	fddiv.appendChild(fonlinediv);
	if (self.status == "online") {
		fonlinediv.id = 'fonline';
	}
	else {
		fonlinediv.id = 'foffline';
		fddiv.appendChild(flogtimediv);
		fddiv.appendChild(flogdatediv);
	}			
	div.appendChild(fddiv);	
};

this.showoptions = function() {
	var self = this;
	var div = self.Div; 
	var fddiv = null;
	var status = null; 
	var fnamediv = null;
	var fpicdiv = null;
	var fpic = null;  
	var fonlinediv = null;
	var flogtime = null;
	var flogdate = null;	

	var fdright = null;
	var fdleft = null; 
	var cancelButton = null;
	cancelButton = document.createElement('input');
	cancelButton.type = 'button';
	cancelButton.className = 'inputButton';
	cancelButton.id = 'editCancel';
	cancelButton.onclick = self.toggle;
	cancelButton.value = 'Cancel';

	fddiv = document.createElement('div');
	fddiv.id = 'friend' + self.index;
	fddiv.className = 'friend';
	fdleft = document.createElement('span');
	fdleft.id = 'fdleft';
	fdright = document.createElement('span');
	fdright.id = 'fdright';		
	fnamediv = document.createElement('div');
	fpicdiv = document.createElement('div');
	fpic = document.createElement('img');
	fpic.src = self.pic;
	fpic.className = 'fpic';
	fonlinediv = document.createElement('div');
	fonlinediv.id = 'fonlinediv';
	flogtimediv = document.createElement('div');
	flogtimediv.id = 'flogtimediv';
	flogdatediv = document.createElement('div');
	flogdatediv.id = 'flogdatediv';
	fnamediv.appendChild(document.createTextNode(self.name));
	fpicdiv.appendChild(fpic);

	fdright.appendChild(fnamediv);
	fdright.appendChild(fpicdiv);

	fonlinediv.appendChild(document.createTextNode(self.status));
	flogtimediv.appendChild(document.createTextNode(self.logtime));
	flogdatediv.appendChild(document.createTextNode(self.logdate));

	fdright.appendChild(fonlinediv);
	if (self.status == "online") {
		fonlinediv.id = 'fonline';
	}
	else {
		fonlinediv.id = 'foffline';
		fdright.appendChild(flogtimediv);
		fdright.appendChild(flogdatediv);
	}
	fddiv.appendChild(fdright);

	fdleft.appendChild(cancelButton);
	fddiv.appendChild(fdleft);

	div.appendChild(fddiv);	
};

this.cleanup = function() {
	var self = this;
	self.Div = null;
	self.ajax = null; 
	self.id = 0;
	self.name = null;
	self.pic = null;
	self.status = null;
	self.logtime = null;
	self.logdate = null;
};
}

    [SOLVED] need help passing array from php to ajax function....

    in Javascript Help

    Posted

    update

     

    ok... not sure it is right but it seems to be working for me anyhow.....

     

    my php file i added a | to the end of id for a seperator......

     

    <?php
$userid = $_GET['uid'];
$index = 0;
$ids = array();

$query = null;
//open connection to db.
$connection = mysql_connect($host, $user, $pass)
or die ('unable to connect!');
//select  database to use.
mysql_select_db($db) or die ('unable to select database!');
$query = "select friendid, friendname from friends where myid = '" . $userid . "' and status = 'accepted'";
$result = mysql_query($query);
$query = null;
header("Content-Type: plain/text");
while ($row = mysql_fetch_row($result))
{  
$id = $row[0];
print $ids[$index] = $id."|";
$index ++;
}
mysql_free_result($result);
//close database
mysql_close($connection);

?>

     

    and form my ajax i have this..... (and it all prints out correctly now)

     

    this.sort = function(str) {
	var self = getfriends;
	var br = self.br;
	var newdiv = null;
	var id = 0;
	var ids = str.split('|'); 
	var div = self.Div;
	for (var i = 0; i < ids.length; i++) {	
		var id = ids[i];		
		newdiv = document.createElement('div');
		newdiv.id = 'test';
		newdiv.appendChild(document.createTextNode(id));
		newdiv.appendChild(self.br);
		div.appendChild(newdiv);

	}	
};

    [SOLVED] need help passing array from php to ajax function....

    in Javascript Help

    Posted

    update....

    ok i can now get the info that i want, the id#

     

    the problem i am now having is that for some reason all my double digit id#s get separated like so...... 15 18 3 2 14 would read out 1  5  1  8  3  2  1  4....

     

    can anybody please help.......

     

    here is my two codes...

    php code

    
<?php
$userid = $_GET['uid'];
$index = 0;
$ids = array();

$query = null;
//open connection to db.
$connection = mysql_connect($host, $user, $pass)
or die ('unable to connect!');
//select  database to use.
mysql_select_db($db) or die ('unable to select database!');
$query = "select friendid, friendname from friends where myid = '" . $userid . "' and status = 'accepted'";
$result = mysql_query($query);
$query = null;
header("Content-Type: plain/text");
while ($row = mysql_fetch_row($result))
{  
$id = $row[0];
print $ids[$index] = $id;
$index ++;
}
mysql_free_result($result);
//close database
mysql_close($connection);

?>

     

    and the part of my ajax that handles this is

     

    
this.sort = function(str) {
	var self = getfriends;
	var newdiv = null;
	var id = '';
	var ids = str; 
	var div = self.Div;
	for (var i = 0; i < ids.length; i++) {	
		var id = ids[i];

		newdiv = document.createElement('div');
		newdiv.id = 'test';
		newdiv.appendChild(document.createTextNode(id));
		div.appendChild(newdiv);
	}	
};

    [SOLVED] need help passing array from php to ajax function....

    in Javascript Help

    Posted

    update

    well i made some more changes

    and now it prints Array out on the screen....

    please help....

     

    this.sort = function(str) {
	var self = getfriends;
	var newdiv = null;
	var ids = [];
	ids = str;  
	var div = self.Div;
	for (var i = 0; i < str.length;) {	
		var id = str[i];
		i++		
		newdiv = document.createElement('div');
		newdiv.id = 'test';
		newdiv.appendChild(document.createTextNode(id));
		div.appendChild(newdiv);
	}	
};

    [SOLVED] need help passing array from php to ajax function....

    in Javascript Help

    Posted

    update

    changed the while to a for and removed the yamlparser. now i am gettine some results........

    this.sort = function(str) {
	var self = getfriends;
	var newdiv = null;
	var ids = []; 
	var div = self.Div;

	for (var i = 0; i < str.length; i++) {


		newdiv = document.createElement('div');
		newdiv.id = 'test';
		newdiv.appendChild(document.createTextNode('test'));
		div.appendChild(newdiv);
	}	
};

    [SOLVED] need help passing array from php to ajax function....

    in Javascript Help

    Posted

    maybe it is just me but i dont seem to understand how to do this....

     

    can somebody please point me to a simple working example of how i can do something like this......

     

    in the php file i get this

    $userid = $_GET['uid'];
$index = 0;
$ids = array();

$query = null;
//open connection to db.
$connection = mysql_connect($host, $user, $pass)
or die ('unable to connect!');
//select  database to use.
mysql_select_db($db) or die ('unable to select database!');
$query = "select * from friends where myid = '" . $userid . "' and status = 'accepted'";
$result = mysql_query($query);
$query = null;
header("Content-Type: plain/text");
while ($row = mysql_fetch_row($result))
{  
$ids[$index] = $row[0];
}
mysql_free_result($result);
//close database
mysql_close($connection);

print $ids;

     

    now to handle this in my ajax i have this segment....

    and yes i know that it would only display the word test if it was working.......

    in my getfriends.js 

    this.parseYamlResult = function(str) {
	var arr = [];
	var res = [];
	var pat = /(\S+): (\S+)\n/g;
	while (arr = pat.exec(str)) {
		res[arr[1]] = arr[2];

	}
	return res;
}; 

this.sort = function(str) {
	var self = getfriends;
	var newdiv = null;
	var ids = []; 
	var div = self.Div;
	ids = self.parseYamlResult(str);
	while (var i = 0; i < ids.length; i++) {


		newdiv = document.createElement('div');
		newdiv.id = 'test';
		newdiv.appendChild(document.createTextNode('test'));
		div.appendChild(newdiv);
	}	
};

    [SOLVED] need some help getting an image....

    in Javascript Help

    Posted

    dont know if  i did it correct or not but i created the img with inside a div inside the my ajax folder function the just sent back the src of the image and assigned that to the img tag that i created. it works anyhow......

     

    self.sponser = ++self.sponser;
			self.togglefolder(true);
			folder = document.createElement('div');
			folder.className = 'folderdiv1';
			add = document.createElement('div');
			add.className = 'folderadd';
			add.appendChild(document.createTextNode(line2));
			add.appendChild(document.createElement('br'));
			add.appendChild(document.createTextNode(line3));
			add.appendChild(document.createElement('br'));
			add.appendChild(document.createTextNode(line4));
			img = document.createElement('img');
			img.src = file; 
			img.className = 'folderimg';
			clearAll = document.createElement('br');
			clearAll.className = 'clearAll';
			folder.appendChild(add);
			folder.appendChild(img);
			folder.appendChild(clearAll);
			if (displays.firstChild) {
				displays.removeChild(displays.firstChild);
			}
			displays.appendChild(folder);
			self.getsponsersdelay();

     

    like i said may not be perfectly correct but it works......

     

    thanks mike.....

    [SOLVED] need some help getting an image....

    in Javascript Help

    Posted

    i have a script set up that will get some values from a php file.

    then there is a delay and then it will get another value from the same php file.

    after the cycle gets the last set of values from that file it will reset and start over getting the values again.....

     

    the ajax script inserts the value onto my page, then when the next value comes in after the delay it will remove the first value and replace it with the second and so on....

     

    how can i get one of the values returned to be an image that is stored on my machine....

    o ya, all the scripts are local on my machine..... only on localhost.......

    here is the ajax file....

    var Folder = new function() {
this.ajax = null;
this.enable = true;
this.folderDiv1 = null;
this.folderDiv2 = null;
this.sponser = 1; 
this.getsponserhand = null;

this.init = function() {
	var self = Folder;
	self.ajax = new Ajax();
	var enable = self.enable; 
	self.folderDiv1 = document.getElementById('folderDiv1');
	self.folderDiv2 = document.getElementById('folderDiv2');
	self.togglefolder(enable);
	self.getsponsers();		
};

this.togglefolder = function(able) {
	var self = Folder;
	if (able) {
		self.folderDiv2.className = 'folderActive';
		self.folderDiv1.className = 'folderDisabled';
		self.folderDiv1.disabled = true;
		self.folderDiv2.onclick = self.getupdates;
	}
	else {
		self.folderDiv2.className = 'folderDisabled';
		self.folderDiv1.className = 'folderActive';
		self.folderDiv2.disabled = true;
		self.folderDiv1.onclick = self.getsponsers;
	}
};

this.getupdates = function() {
	var self = Folder;
	self.stopdelay();
	self.ajax.doGet('/ajaxtest/update.php?sponser=' + self.sponser, self.showfolder2);
	self.enable = false; 
};	

this.getsponsers = function() {
	var self = Folder;
	self.ajax.doGet('/ajaxtest/sponsers.php?sponser=' + self.sponser, self.showfolder1);
	self.enable = true; 
};

this.getsponsersdelay = function() {
	var self = Folder;
	self.getsponserhand = setTimeout(self.getsponsers, 1500);
};	

this.stopdelay = function() {
	var self = Folder;
	clearTimeout(self.getsponserhand);
	if (self.ajax) {
		self.ajax.abort();
	}
};

this.showfolder1 = function(str) {
	var self = Folder;
	var displays = document.getElementById('displays');
	var folder = null;
	if (str==100) {
		self.sponser = 1;
		self.getsponsers();
	}
	else {
		self.sponser = ++self.sponser;
		self.togglefolder(true);
		folder = document.createElement('div');
		folder.className = 'folderDiv1';
		folder.appendChild(document.createTextNode(str));
		if (displays.firstChild) {
			displays.removeChild(displays.firstChild);
		}
		displays.appendChild(folder);
		self.getsponsersdelay();
	}	
};

this.showfolder2 = function(str) {
	var self = Folder;
	var displays = document.getElementById('displays');
	var folder = null;
	self.togglefolder(false);
	folder = document.createElement('div');
	folder.className = 'folderDiv2';
	folder.appendChild(document.createTextNode(str));
	if (displays.firstChild) {
		displays.removeChild(displays.firstChild);
	}
	displays.appendChild(folder);		
};

this.cleanup = function() {
	var self = Folder;
	self.ajax = null;
	self.enable = null;
	self.folderDiv1 = null;
	self.folderDiv2 = null;
	self.sponser = 1;
	self.getsponserhand = null;
};
};

     

    and my php file....

    <?php
$sponser = $_GET['sponser'];
if($sponser==1) {
header('Content-Type: text/plain');
print "meo2000.net";
}elseif($sponser==2) {
header('Content-Type: text/plain');
print "the cleaning lady";
}elseif($sponser==3) {
//$file = 'sspx0044.jpg';
//$fh = fopen($file, 'r');
//$data = fread($fh, filesize($file));
//fclose($fh);
//$filesize = filesize($file);
//$filetype = filetype($file);
//header("Content-Disposition: attachment; filename=$file");
   //header("Content-length: $filesize");
   //header("Content-type: $filetype");
   header('Content-Type: text/plain');
$data = "this will b an image soon";	
print $data;

}else{
print "100";
}

     

    any help would be great....  thanks mike

    [SOLVED] help getting value from a cookie

    in Javascript Help

    Posted

    ok i got it worked out...

     

    this is the change that i made:

    change in this.init      self.user = self.getCookie('user');

    then added the getcookie function.......

    and now all is working well.......

     

            this.init = function() {
	var self = user;
	self.user = self.getcookie('user'); 
	self.ajax = new Ajax();
	self.getinfo();
};

this.getcookie = function(c_name) {
	var self = user;
	if (document.cookie.length>0)
	  {
	  c_start=document.cookie.indexOf(c_name + "=");
	  if (c_start!=-1)
	    {
	    c_start=c_start + c_name.length+1;
	    c_end=document.cookie.indexOf(";",c_start);
	    if (c_end==-1) c_end=document.cookie.length;
	    return unescape(document.cookie.substring(c_start,c_end));
	    }
	  }
	return "";
}

    [SOLVED] help getting value from a cookie

    in Javascript Help

    Posted

    as i am still very new with working with ajax and js.... i need some help getting the value of a cookie......

     

    this is all just for learning by the way....

     

    the cookie is set when a php script validates a user,

    if ($loginId == 'mike' && $password == 'mike11') {
//setcookie('userID', 12345);
setcookie("user", $loginId, mktime()+1209600);
$respType = 'success';
$respMsg = 'userhome.html';
}else{

     

    i know this part works!

     

    here is the ajax part....

    look to  this.init = function()  @@@  self.user = document.cookie.value; ...

    how should this be.....

     

    var user = new function() {
this.ajax = null;
this.user = '';

this.init = function() {
	var self = user;
	self.user = document.cookie.value; 
	self.ajax = new Ajax();
	self.getinfo();
};

this.getinfo = function() {
	var self = user;
	self.ajax.doGet('/ajaxtest/getuser.php?user=' + self.user, self.setresult);	
};

this.setresult = function(str) {
	var self = user;
	var respArr = str.split(',');
	var name = respArr[0];
	var number = respArr[1];
	var userSpan = document.getElementById('userSpan');
	var userDiv = document.getElementById('userDiv');
	if (userSpan.firstChild) {
		userSpan.removeChild(userSpan.firstChild);
	}
	if (userDiv.firstChild) {
		userDiv.removeChild(userDiv.firstChild);
	}
	userSpan.appendChild(document.createTextNode(number));
	userDiv.appendChild(document.createTextNode(name));	
};

this.clearCookie = function(name) {
	var expireDate = new Date(0);
	document.cookie = name + '=; expires=' + expireDate.toGMTString() + '; path=/';
};

this.cleanup = function() {
	var self = user;
	self.ajax = null;
	self.user = null;
	self.clearCookie(user);
};

};

window.onload = user.init;
window.onunload = user.cleanup;

     

    thanks mike.....

    [SOLVED] new at this please help

    in Javascript Help

    Posted

    i have figured out the problem

     

    it was with the file appmonitor2.js

     

    here is the new one  for comparison

     

    notice the moved

    window.onload = Monitor.init;

     

    var Status = new function() {
this.init = function() {
	// dont mind me, just a sub ...
};
this.startProc = function() {
	// another stub function
};
}

var Monitor = new function() {
this.targetURL = null;
this.pollInterval = null;
this.maxPollEntries = null;
this.timeoutThreshold = null;
this.ajax = new Ajax();
this.start = 0;
this.pollArray = [];
this.pollHand = null;
this.timeoutHand = null;
this.reqStatus = Status;

this.init = function() {
	var self = Monitor;
	self.targetURL = TARGET_URL;
	self.pollInterval = POLL_INTERVAL;
	self.maxPollEntries = MAX_POLL_ENTRIES;
	self.timeoutThreshold = TIMEOUT_THRESHOLD;
	self.toggleAppStatus(true);
	self.reqStatus.init();
};





this.toggleAppStatus = function(stopped) {
	var self = Monitor;
	self.toggleButton(stopped);
	self.toggleStatusMessage(stopped);
};

this.toggleButton = function(stopped) {
	var self = Monitor;
	var buttonDiv = document.getElementById('buttonArea');
	var but = document.createElement('input');
	but.type = 'button';
	but.className = 'inputButton';
	if (stopped) {
		but.value = 'Start';
		but.onclick = self.pollServerStart;
	}
	else {
		but.value = 'Stop';
		but.onclick = self.pollServerStop;
	}
	if (buttonDiv.firstChild) {
		buttonDiv.removeChild(buttonDiv.firstChild);
	}
	buttonDiv.appendChild(but);
	buttonDiv = null;
};

this.toggleStatusMessage = function(stopped) {
	var statSpan = document.getElementById('currentAppState');
	var msg;
	if (stopped) {
		msg = 'Stopped';
	}
	else {
		msg = 'Running';
	}
	if (statSpan.firstChild) {
		statSpan.removeChild(statSpan.firstChild);
	}
	statSpan.appendChild(document.createTextNode(msg));
};

this.pollServerStart = function() {
	var self = Monitor;
	self.doPoll();
	self.toggleAppStatus(false);
};
this.pollServerStop = function() {
	alert('This will stop the application polling the server.');
};

this.doPoll = function() {
	var self = Monitor;
	var url = self.targetURL;
	var start = new Date();
	self.reqStatus.startProc();
	self.start = start.getTime();
	self.ajax.doGet(self.tartgetURL + '?start=' + self.start, self.showPoll);
	self.timeoutHand = setTimeout(self.handleTimeout, self.timeoutThreshold * 1000);
};

this.showPoll = function(str) {
	var self = Monitor;
	var diff = 0;
	var end = new Date();
	clearTimeout(self.timeoutHand);
	self.reqStatus.stopProc(true);
	if (str == 'ok') {
		end = end.getTime();
		diff = (end - self.start) / 1000;
	}
	if (self.updatePollArray(diff)) {
		self.printResult();
	}
	self.doPollDelay();
};

this.doPollDelay = function() {
	var self = Monitor;
	self.pollHand = setTimeout(self.doPoll, self.pollInterval * 1000);
};

this.handleTimeout = function() {
	alert("Timeout!");
};

this.updatePollArray = function(responseTime) {
	alert("Recording response time: " + responseTime);
};

this.printResult = function() {
	//empty stub function
};
}

window.onload = Monitor.init;

    [SOLVED] new at this please help

    in Javascript Help

    Posted

    please help, i am trying to get an understanding for ajax and js......

     

    i found a site http://www.sitepoint.com/article/build-your-own-ajax-web-apps/3/ and a book with the same examples in it...

     

    maybe it is just me but i cant seem to get this part to work right.......

     

    the first example worked fine....

     

    here is what i got.

    appmonitor2.html

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3c.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type"
		content="text/html; charset=iso-8859-1" />
	<title>App Monitor</title>
	<script type="text/javascript" src="ajax.js"></script>
	<script type="text/javascript">
		// URL to monitor
		var TARGET_URL = 'fakeserver.php';
		// Seconds between request
		var POLL_INTERVAL = 5;
		// How many entities bars to show in the bar graph
		var MAX_POLL_ENTRIES = 10;
		// Seconds to wait for server response
		var TIMEOUT_THRESHOLD = 10;
	</script>
	<script type="text/javascript" src="appmonitor2.js"></script>

	<link rel="stylesheet" href="appmonitor2.css" type="text/css" />		
</head>
<body>
	<div id="statusMessage">App Status:
		<span id="currentAppState"></span>
	</div>
	<div id="buttonArea"></div>
</body>
</html>

     

    ajax.js  (was required in the first example as well and it works.) 

    function Ajax() {
this.req = null;
this.url = null;
this.method = 'GET';
this.async = true;
this.status = null;
this.statusText = '';
this.postData = null;
this.readyState = null;
this.responseText = null;
this.responseXML = null;
this.handleResp = null;
this.responseFormat = 'text', // 'text', 'xml', or 'object'
this.mimeType = null;

this.init = function() {
	if (!this.req) {
		try {
			//Try to create object for Firefox, Safari, IE7, etc.
			this.req = new XMLHttpRequest();
		}
		catch (e) {
			try {
				// Try to create object for later versions of IE.
				this.req = new ActiveXObject('MSXML2.XMLHTTP');
			}
			catch (e) {
				try {
					//Try to create object for early versions of IE.
					this.req = new AxtiveXObject('Microsoft.XMLHTTP');
				}
				catch (e) {
					//could not create an xmlhttprequest object.
					return false;
				}
			}
		}
	}
	return this.req;
};

this.doReq = function() {
	if (!this.init()) {
		alert('could not create XMLHttpRequest object.');
		return;
	}
	this.req.open(this.method, this.url, this.async);
	if (this.mimeType) {
		try {
			req.overrideMimeType(this.mimeType);
		}
		catch (e) {
			// couldn't override MIME type -- IE6 or Opera?
		}
	}
	var self = this; // Fix loss-of-scope in inner function
	this.req.onreadystatechange = function() {
		var resp = null;
		if (self.req.readyState == 4) {
			switch (self.responseFormat) {
				case 'text':
					resp = self.req.responseText;
					break;
				case 'xml':
					resp = self.req.responseXML;
					break;
				case 'object':
					resp = req;
					break;
			}
			if (self.req.status >= 200 && self.req.status <= 299) {
				self.handleResp(resp);
			}
			else{
				self.handleErr(resp);
			}
		}
	};
	this.req.send(this.postData);
};

this.setMimeType = function(mimeType) {
	this.mimeType = mimeType;
};

this.handleErr = function() {
	var errorWin;
	try {
		errorWin = window.open('', 'errorWin');
		errorWin.document.body.innerHTML = this.responseText;
	}
	catch (e) {
		alert('An error occurred, but the error message cannot be '
		+ 'displayed. This is probably because of your browser\'s '
		+ 'pop-up blocker.\n'
		+ 'Please allow pop-ups from this web site if you want to '
		+ 'see the full error message.\n'
		+ '\n'
		+ 'Status Code: ' + this.req.status + '\n'
		+ 'Status Description: ' + this.req.statusText);
	}
};

this.abort = function() {
	if (this.req) {
		this.req.onreadystatechange = function() { };
		this.req.abort();
		this.req = null;
	}
};

this.doGet = function(url, hand, format) {
	this.url = url;
	this.handleResp = hand;
	this.responseFormat = format || 'text';
	this.doReq();
};

}

     

    fakeserver.php

    <?php
header('Content-Type: text/plain');
sleep(rand(1, 5));
print 'ok';
?>

     

    and appmonitor2.js

    var Status = new function() {
this.init = function() {
	// dont mind me, just a sub ...
};
this.startProc = function() {
	// another stub function
};
}

var Monitor = new function() {
this.targetURL = null;
this.pollInterval = null;
this.maxPollEntries = null;
this.timeoutThreshold = null;
this.ajax = new Ajax();
this.start = 0;
this.pollArray = [];
this.pollHand = null;
this.timeoutHand = null;
this.reqStatus = Status;

this.init = function() {
	var self = Monitor;
	self.targetURL = TARGET_URL;
	self.pollInterval = POLL_INTERVAL;
	self.maxPollEntries = MAX_POLL_ENTRIES;
	self.timeoutThreshold = TIMEOUT_THRESHOLD;
	self.toggleAppStatus(true);
	self.reqStatus.init();
};

window.onload = Monitor.init;

this.toggleAppStatus = function(stopped) {
	var self = Monitor;
	self.toggleButton(stopped);
	self.toggleStatusMessage(stopped);
};

this.toggleButton = function(stopped) {
	var self = Monitor;
	var buttonDiv = document.getElementById('buttonArea');
	var but = document.createElement('input');
	but.type = 'button';
	but.className = 'inputButton';
	if (stopped) {
		but.value = 'Start';
		but.onclick = self.pollServerStart;
	}
	else {
		but.value = 'Stop';
		but.onclick = self.pollServerStop;
	}
	if (buttonDiv.firstChild) {
		buttonDiv.removeChild(buttonDiv.firstChild);
	}
	buttonDiv.appendChild(but);
	buttonDiv = null;
};

this.toggleStatusMessage = function(stopped) {
	var statSpan = document.getElementById('currentAppState');
	var msg;
	if (stopped) {
		msg = 'Stopped';
	}
	else {
		msg = 'Running';
	}
	if (statSpan.firstChild) {
		statSpan.removeChild(statSpan.firstChild);
	}
	statSpan.appendChild(document.createTextNode(msg));
};

this.pollServerStart = function() {
	var self = Monitor;
	self.doPoll();
	self.toggleAppStatus(false);
};
this.pollServerStop = function() {
	alert('This will stop the application polling the server.');
};

this.doPoll = function() {
	var self = Monitor;
	var url = self.targetURL;
	var start = new Date();
	self.reqStatus.startProc();
	self.start = start.getTime();
	self.ajax.doGet(self.tartgetURL + '?start=' + self.start, self.showPoll);
	self.timeoutHand = setTimeout(self.handleTimeout, self.timeoutThreshold * 1000);
};

this.showPoll = function(str) {
	var self = Monitor;
	var diff = 0;
	var end = new Date();
	clearTimeout(self.timeoutHand);
	self.reqStatus.stopProc(true);
	if (str == 'ok') {
		end = end.getTime();
		diff = (end - self.start) / 1000;
	}
	if (self.updatePollArray(diff)) {
		self.printResult();
	}
	self.doPollDelay();
};

this.doPollDelay = function() {
	var self = Monitor;
	self.pollHand = setTimeout(self.doPoll, self.pollInterval * 1000);
};

this.handleTimeout = function() {
	alert("Timeout!");
};

this.updatePollArray = function(responseTime) {
	alert("Recording response time: " + responseTime);
};

this.printResult = function() {
	//empty stub function
};
}

     

    at this point I should be able to load the page and see the example  figure 3.2.

    but all I see is the

     

    App Status:

     

    can anybody help...

    Some serious advice needed

    in HTML Help

    Posted

    i do all my design and development (html, sql, css, php, some js) with bluefish (a text style editor), but i use a linux os....

     

    that is just how i learned, if you learn with a graphical style editor that will be what you will prefer.......

     

    mike.....

     

     

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.