Today's Posts Follow Us On Twitter! TFL Members on Twitter  
Forum search: Advanced Search  
Navigation
Marketplace
  Members Login:
Lost password?
  Forum Statistics:
Forum Members: 24,254
Total Threads: 80,792
Total Posts: 566,471
There are 1196 users currently browsing (tf).
 
  Our Partners:
 
  TalkFreelance     Design and Development     Programming     Javascript :

JavaScript Fun

Thread title: JavaScript Fun
Closed Thread    
    Thread tools Search this thread Display Modes  
11-15-2005, 07:25 PM
#1
Lord Kalthorn is offline Lord Kalthorn
Lord Kalthorn's Avatar
Status: I love this place
Join date: Jan 2005
Location: Greathanc
Expertise:
Software:
 
Posts: 743
iTrader: 0 / 0%
 

Lord Kalthorn is on a distinguished road

Send a message via MSN to Lord Kalthorn

  Old  JavaScript Fun

I did this Menu a few weeks ago now... but I came across a problem with the design having it all written from the Server. Basic history of the page is that it is just a piece of fun for me to see if I can do a refreshless page. It might go into the Forum Software I'm building, if it works well enough, but probably not. Hence why I cannot have a Menu built on the Server, because the design incorporates a 'Favourites Menu' where there are links to sites the user specifies. That idea was a bit of fun too, probably not useful on a site at all, but interesting. The idea is, as a refreshless page, the user will be able to change the Favourites without refresh, which means the Menus need to be built on site with JavaScript.

I pondered for a little while and came up with this that comes from the server:

Code:
<div id="menuItem_1" class="menuItem">
	Home,1,i:Calendar,2,i:FAQ,3,i:Memberlist,4,i:New Items,5,i:Subscriptions,6,i:Usergroups,7,i:Who's Online,8,i
</div>
I designed it so it could have two runs in a JavaScript Split Function, one to split the Tabs, one to split the attributes. The First is the Title of the Tab (Text), the Second is the Id of the Tab (for Hovering and Page Changing uses), the third is a ClassId (for use because some Items will just be text, like the Search Area).

The problem I have is with the main body of code that writes the menu:

Code:
function writeMenu(Content) {
	var menuString = Content;
	var menuBlock = document.getElementById('mnus');
	var menuOutputString = '<table cellpadding="0px" cellspacing="0px" style="width:100%;"><tr><td class="spec_t">&nbsp;</td>';
	var regExp = /:/;
	var stringArray = menuString.split(regExp);

	for (var i = 0; i <= stringArray.length; i++) {
		var regExp = /,/;
		var finalArray = stringArray[i].split(regExp);

		var menuItemTitle = finalArray[0];
		var menuItemId = finalArray[1];
		var menuItemClass = finalArray[2];

		menuOutputString += '<td id="menu_'
		menuOutputString += menuItemId;
		menuOutputString += '" class="scnd_';
		menuOutputString += menuItemClass;
		menuOutputString += '" onmouseover="submenuIn(\'';
		menuOutputString += menuItemId;
		menuOutputString += '\')" onmouseout="submenuOut(\'';
		menuOutputString += menuItemId;
		menuOutputString += '\')" onclick="pageTabOn(\'';
		menuOutputString += menuItemId;
		menuOutputString += '\');"><span>';
		menuOutputString += menuItemTitle;
		menuOutputString += '</span></td>';

		if (i != stringArray.length) {
			menuOutputString += '<td class="spec_t">&nbsp;</td>';
		}
	}

	menuOutputString += '<td class="spec_r">&nbsp;</td></tr></table>';

	menuBlock.innerHTML = menuOutputString;
}
I know this all works except for one pivotal bit; the 'stringArray[i].split(regExp)' bit. I know the rest works because I have put 0 in where the i is, and got all the menu items as 'Home'. I know it cuts it and puts in all the variables, because when I put 0 as i and ran it, the function that sets the Tab when a menu is shown by its Id set when the page is sent runs properly, so the Id and the Class Name is being set properly. I know the first split has created all the Array Items, as the loop makes as many Homes as there would be menu items.

I cannot figure what the problem with putting the i in the stringArray to loop it is... I even went to look at the JavaScript Console in Firefox to see what it thought, and it said stringArray[i] has no properties. The page where this is half working is here. It is set to 'stringArray[i].split(regExp)' at the moment, but I might fiddle with it later so if it shows loads of Home Tabs, I'm fiddling with it :P

Just wondered if anybody else had had this problem and solved it? Or if somebody knows a site where they might know the answer?

Closed Thread    


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes

  Posting Rules  
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump:
 
  Contains New Posts Forum Contains New Posts   Contains No New Posts Forum Contains No New Posts   A Closed Forum Forum is Closed