oop php - categories ( on mouse over show 5 subcats )

(2 Pages)
1
2
→

18 Replies - 3445 Views - Last Post: 26 May 2009 - 12:12 AM Rate Topic:

#1 blackpoet

New D.I.C Head

Reputation: 0

Posts: 13
Joined: 20-May 09

oop php - categories ( on mouse over show 5 subcats )

Posted 25 May 2009 - 08:22 AM

Hey guys

I have come across a problem where i dont even know where to start.

-

When i open the .php file that shows the categorys, it basicly doesnt show anything except for php sign...

I would like to know how can i programm the categories to show 5 subcategories on mouseover ? with clickable links ?

this is the code that mainly displays the categories :

 <td colspan="3" class="category_bdr"><div class="leftnav_link">
			  <?php echo defined('SHOWCAT') ? SHOWCAT : '' ?>

and this is in the model folder of the script :

<?php
class Model_MCategorySelection
{
	function showCategory()
	{
		include("classes/Lib/HandleErrors.php");
		include("admin/cache/sitesettings.php");
		include("classes/Core/Sell/CCategorySelection.php");
		$default = new Core_Sell_CCategorySelection();
		$default->displayCategory($Err);
		
		if(isset($_GET['id']))
			$default->displaySubCategory();
		include_once('classes/Core/Category/CCategory.php');
		$cat = new Core_Category_CCategory();
		$cat->showCat();	
			
		include("templates/sellcategory.php");
	}
	
	function showSubCategory()
	{
		include("classes/Core/Sell/CCategorySelection.php");
		$default = new Core_Sell_CCategorySelection();
		if(isset($_GET['action']) && $_GET['action'] == 'showsubcat' && $_GET['id'])
			$default->displaySubCategory();
	}
	
	function selectCategory()
	{
		include("classes/Lib/HandleErrors.php");
		include("classes/Core/Validation/CheckInputs2.php");
		include("classes/Core/Sell/CCategorySelection.php");
		new Core_Validation_CheckInputs2('category');
		$default = new Core_Sell_CCategorySelection();
		$default->displayCategory($Err);
		$_SESSION['auctioncategory'] = array("rootid"=>$_POST['rid'],"catid"=>$_POST['idselected'],"catlist"=>$_POST['catext']);
		 if(isset($_GET['itmid']))
		 	header("Location:?do=relistauction&id=".$_GET['itmid']."&itmid=".$_GET['itmid']);
		 else	
		 	header("Location:?do=postlistingdetail");
	}
}
?>

any help would be great

This post has been edited by blackpoet: 25 May 2009 - 08:23 AM

Is This A Good Question/Topic? 0

Replies To: oop php - categories ( on mouse over show 5 subcats )

#2 Wimpy

R.I.P. ( Really Intelligent Person, right? )

Reputation: 159

Posts: 1,038
Joined: 02-May 09

Re: oop php - categories ( on mouse over show 5 subcats )

Posted 25 May 2009 - 08:33 AM

To get anything to happen on mouseover you need to use Javascript and write some DHTML!

blackpoet, on 25 May, 2009 - 05:22 PM, said:

Hey guys

I have come across a problem where i dont even know where to start.

-

When i open the .php file that shows the categorys, it basicly doesnt show anything except for php sign...

I would like to know how can i programm the categories to show 5 subcategories on mouseover ? with clickable links ?

this is the code that mainly displays the categories :

 <td colspan="3" class="category_bdr"><div class="leftnav_link">
			  <?php echo defined('SHOWCAT') ? SHOWCAT : '' ?>

and this is in the model folder of the script :

<?php
class Model_MCategorySelection
{
	function showCategory()
	{
		include("classes/Lib/HandleErrors.php");
		include("admin/cache/sitesettings.php");
		include("classes/Core/Sell/CCategorySelection.php");
		$default = new Core_Sell_CCategorySelection();
		$default->displayCategory($Err);
		
		if(isset($_GET['id']))
			$default->displaySubCategory();
		include_once('classes/Core/Category/CCategory.php');
		$cat = new Core_Category_CCategory();
		$cat->showCat();	
			
		include("templates/sellcategory.php");
	}
	
	function showSubCategory()
	{
		include("classes/Core/Sell/CCategorySelection.php");
		$default = new Core_Sell_CCategorySelection();
		if(isset($_GET['action']) && $_GET['action'] == 'showsubcat' && $_GET['id'])
			$default->displaySubCategory();
	}
	
	function selectCategory()
	{
		include("classes/Lib/HandleErrors.php");
		include("classes/Core/Validation/CheckInputs2.php");
		include("classes/Core/Sell/CCategorySelection.php");
		new Core_Validation_CheckInputs2('category');
		$default = new Core_Sell_CCategorySelection();
		$default->displayCategory($Err);
		$_SESSION['auctioncategory'] = array("rootid"=>$_POST['rid'],"catid"=>$_POST['idselected'],"catlist"=>$_POST['catext']);
		 if(isset($_GET['itmid']))
		 	header("Location:?do=relistauction&id=".$_GET['itmid']."&itmid=".$_GET['itmid']);
		 else	
		 	header("Location:?do=postlistingdetail");
	}
}
?>

any help would be great

Was This Post Helpful? 0

#3 blackpoet

New D.I.C Head

Reputation: 0

Posts: 13
Joined: 20-May 09

Re: oop php - categories ( on mouse over show 5 subcats )

Posted 25 May 2009 - 08:54 AM

Wimpy, on 25 May, 2009 - 07:33 AM, said:

To get anything to happen on mouseover you need to use Javascript and write some DHTML!

blackpoet, on 25 May, 2009 - 05:22 PM, said:

Hey guys

I have come across a problem where i dont even know where to start.

-

When i open the .php file that shows the categorys, it basicly doesnt show anything except for php sign...

I would like to know how can i programm the categories to show 5 subcategories on mouseover ? with clickable links ?

this is the code that mainly displays the categories :

 <td colspan="3" class="category_bdr"><div class="leftnav_link">
			  <?php echo defined('SHOWCAT') ? SHOWCAT : '' ?>

and this is in the model folder of the script :

<?php
class Model_MCategorySelection
{
	function showCategory()
	{
		include("classes/Lib/HandleErrors.php");
		include("admin/cache/sitesettings.php");
		include("classes/Core/Sell/CCategorySelection.php");
		$default = new Core_Sell_CCategorySelection();
		$default->displayCategory($Err);
		
		if(isset($_GET['id']))
			$default->displaySubCategory();
		include_once('classes/Core/Category/CCategory.php');
		$cat = new Core_Category_CCategory();
		$cat->showCat();	
			
		include("templates/sellcategory.php");
	}
	
	function showSubCategory()
	{
		include("classes/Core/Sell/CCategorySelection.php");
		$default = new Core_Sell_CCategorySelection();
		if(isset($_GET['action']) && $_GET['action'] == 'showsubcat' && $_GET['id'])
			$default->displaySubCategory();
	}
	
	function selectCategory()
	{
		include("classes/Lib/HandleErrors.php");
		include("classes/Core/Validation/CheckInputs2.php");
		include("classes/Core/Sell/CCategorySelection.php");
		new Core_Validation_CheckInputs2('category');
		$default = new Core_Sell_CCategorySelection();
		$default->displayCategory($Err);
		$_SESSION['auctioncategory'] = array("rootid"=>$_POST['rid'],"catid"=>$_POST['idselected'],"catlist"=>$_POST['catext']);
		 if(isset($_GET['itmid']))
		 	header("Location:?do=relistauction&id=".$_GET['itmid']."&itmid=".$_GET['itmid']);
		 else	
		 	header("Location:?do=postlistingdetail");
	}
}
?>

any help would be great

ok, thank you i will check out some tutorials on php oop and javascript.

Was This Post Helpful? 0

#4 Wimpy

R.I.P. ( Really Intelligent Person, right? )

Reputation: 159

Posts: 1,038
Joined: 02-May 09

Re: oop php - categories ( on mouse over show 5 subcats )

Posted 25 May 2009 - 09:07 AM

My suggestion is to output everything at once, and if the user has javascript enabled you hide the content that he/she shouldn't see right away, by simply changing a class name or something on the html elements!

Then you add event listeners OR event handlers to the categories that enables the user to hover over them to open the subcategories! Doing it this way makes your site possible to navigate even without javascript enabled!

This post has been edited by Wimpy: 25 May 2009 - 09:08 AM

Was This Post Helpful? 0

#5 blackpoet

New D.I.C Head

Reputation: 0

Posts: 13
Joined: 20-May 09

Re: oop php - categories ( on mouse over show 5 subcats )

Posted 25 May 2009 - 09:21 AM

Wimpy, on 25 May, 2009 - 08:07 AM, said:

Yes, i get you ...... yes . yes ... so your saying to basicly recreate the category with html...

like this :

  <ul>
							
				<li title="catlist-antiqu-de">
					<a title="catlist-antiqu-de" href="/kaufen/antiquitaeten-und-kunst/c/cn38399/">Antiquitäten &amp; Kunst</a>
					
					<ul><li><a title="catlist-antiqu-sub" href="http://www.mydomain.ch/kaufen/antiquitaeten-und-kunst/antike-spielzeuge/l/cn38425/">Antike Spielzeuge</a></li>

<li><a title="catlist-antiqu-sub" href="/kaufen/antiquitaeten-und-kunst/antike-technik-und-geraete/l/cn38434/">Antike Technik &amp; Geräte</a></li>
<li><a title="catlist-antiqu-sub" href="/kaufen/antiquitaeten-und-kunst/antiquarische-buecher/l/cn38449/">Antiquarische Bücher</a></li>
<li><a title="catlist-antiqu-sub" href="/kaufen/antiquitaeten-und-kunst/figuren-und-objekte/l/cn38455/">Figuren &amp; Objekte</a></li>
<li><a title="catlist-antiqu-sub" href="/kaufen/antiquitaeten-und-kunst/malerei-und-grafiken/l/cn38472/">Malerei &amp; Grafiken</a></li>
<li><a title="catlist-antiqu-sub" href="/kaufen/antiquitaeten-und-kunst/c/cn38399/">Weitere Kategorien...</a></li>
</ul>

Was This Post Helpful? 0

#6 Wimpy

R.I.P. ( Really Intelligent Person, right? )

Reputation: 159

Posts: 1,038
Joined: 02-May 09

Re: oop php - categories ( on mouse over show 5 subcats )

Posted 25 May 2009 - 09:35 AM

Yeah, you could use a structure like this:

<ul id="category_list">
	<li class="category" id="category_name">
		Category Name
		<ul class="subcategory_list" id="sub_parent_category_name">
			<li class="subcategory" id="subcategory_name">Subcategory Name</li>
			<li class="subcategory" id="subcategory_name">Subcategory Name</li>
		</ul>
	</li>
	<li class="category" id="category_name">
		Category Name
		<ul class="subcategory_list" id="sub_parent_category_name">
			<li class="subcategory" id="subcategory_name">Subcategory Name</li>
			<li class="subcategory" id="subcategory_name">Subcategory Name</li>
		</ul>
	</li>
</ul>

Where the id's might be the keys to how to implement it. Say you set an eventlistener to every element with the class "category" that calls a javascript function called OpenSubcategory() you could implement such a function similar to this:

function GetElement(dEventObject)
{
	if(dEventObject.target) // Mozilla/Standard
	{
		return dEventObject.target;
	}
	else if(dEventObject.srcElement) // IE
	{
		return dEventObject.srcElement;
	}
	else
	{
		return false;
	}
}


function OpenSubcategory(dEventObject)
{
	var dElement = GetElement(dEventObject);
	if(dElement == false)
		return;
	
	var subCategory = document.getElementById('sub'+dElement.id);
	
	subCategory.style.display = "block"; 
	
	//OR 
	
	subCategory.style.visibility = true;
	
	//Depending on your own choice!
}

Hope you get an idea!

Google event listeners + javascript!

Was This Post Helpful? 0

#7 blackpoet

New D.I.C Head

Reputation: 0

Posts: 13
Joined: 20-May 09

Re: oop php - categories ( on mouse over show 5 subcats )

Posted 25 May 2009 - 09:41 AM

You see i dont realy understand oop & php that much, so its hard for me to even get a vision

I dont understand where the code goes, because the script i have got is so big :S

not begginer friendly at all

haha

Was This Post Helpful? 0

#8 Wimpy

R.I.P. ( Really Intelligent Person, right? )

Reputation: 159

Posts: 1,038
Joined: 02-May 09

Re: oop php - categories ( on mouse over show 5 subcats )

Posted 25 May 2009 - 09:46 AM

Well, google for javascript and event listeners create a small test page and try some stuff out!

blackpoet, on 25 May, 2009 - 06:41 PM, said:

You see i dont realy understand oop & php that much, so its hard for me to even get a vision

I dont understand where the code goes, because the script i have got is so big :S

not begginer friendly at all

haha

Was This Post Helpful? 0

#9 blackpoet

New D.I.C Head

Reputation: 0

Posts: 13
Joined: 20-May 09

Re: oop php - categories ( on mouse over show 5 subcats )

Posted 25 May 2009 - 10:06 AM

Wimpy, on 25 May, 2009 - 08:46 AM, said:

Well, google for javascript and event listeners create a small test page and try some stuff out!

blackpoet, on 25 May, 2009 - 06:41 PM, said:

You see i dont realy understand oop & php that much, so its hard for me to even get a vision

I dont understand where the code goes, because the script i have got is so big :S

not begginer friendly at all

haha

cool... thnx for the tipp

and thnx for your help. hope it works out for me

the code you gave me, what extension would that have..

and if it had to be placed anywhere, where would i place it

sorry for noob questions..... but now i see your point with that code and i would like to try it.

Was This Post Helpful? 0

#10 Wimpy

R.I.P. ( Really Intelligent Person, right? )

Reputation: 159

Posts: 1,038
Joined: 02-May 09

Re: oop php - categories ( on mouse over show 5 subcats )

Posted 25 May 2009 - 10:15 AM

Well, the first thing with a lot of <div>'s would go into a .html, .html or .php file or whatever file extension that has support for html code. The javacsript bit would either go into the same file or into a .js file! Where to put it is a rather complicated question, it really depends on where you want to use it.

blackpoet, on 25 May, 2009 - 07:06 PM, said:

cool... thnx for the tipp

and thnx for your help. hope it works out for me

the code you gave me, what extension would that have..

and if it had to be placed anywhere, where would i place it

sorry for noob questions..... but now i see your point with that code and i would like to try it.

Was This Post Helpful? 0

#11 blackpoet

New D.I.C Head

Reputation: 0

Posts: 13
Joined: 20-May 09

Re: oop php - categories ( on mouse over show 5 subcats )

Posted 25 May 2009 - 10:15 AM

*edit *

i put the code in the categoryselction file..

it looks like this now, and when i uploaded the files with block aswell as visability it didnt work.... kept showing all the subcategories and not on mouseover..

<?php
class Model_MCategorySelection
{
	function showCategory()
	{
		include("classes/Lib/HandleErrors.php");
		include("admin/cache/sitesettings.php");
		include("classes/Core/Sell/CCategorySelection.php");
		$default = new Core_Sell_CCategorySelection();
		$default->displayCategory($Err);
		
		if(isset($_GET['id']))
			$default->displaySubCategory();
		include_once('classes/Core/Category/CCategory.php');
		$cat = new Core_Category_CCategory();
		$cat->showCat();	
			
		include("templates/sellcategory.php");
	}
	
	function showSubCategory()
	{
		include("classes/Core/Sell/CCategorySelection.php");
		$default = new Core_Sell_CCategorySelection();
		if(isset($_GET['action']) && $_GET['action'] == 'showsubcat' && $_GET['id'])
			$default->displaySubCategory();
	}
	
	function selectCategory()
	{
		include("classes/Lib/HandleErrors.php");
		include("classes/Core/Validation/CheckInputs2.php");
		include("classes/Core/Sell/CCategorySelection.php");
		new Core_Validation_CheckInputs2('category');
		$default = new Core_Sell_CCategorySelection();
		$default->displayCategory($Err);
		$_SESSION['auctioncategory'] = array("rootid"=>$_POST['rid'],"catid"=>$_POST['idselected'],"catlist"=>$_POST['catext']);
		 if(isset($_GET['itmid']))
		 	header("Location:?do=relistauction&id=".$_GET['itmid']."&itmid=".$_GET['itmid']);
		 else	
		 	header("Location:?do=postlistingdetail");
	}
}

	function GetElement(dEventObject)
	{
	if(dEventObject.target) // Mozilla/Standard
	{
		return dEventObject.target;
	}
	else if(dEventObject.srcElement) // IE
	{
		return dEventObject.srcElement;
	}
	else
	{
		return false;
	}
}


function OpenSubcategory(dEventObject)
{
	var dElement = GetElement(dEventObject);
	if(dElement == false)
		return;
   
	var subCategory = document.getElementById('sub'+dElement.id);
   
	subCategory.style.display = true;
 
		}
}
?>

This post has been edited by blackpoet: 25 May 2009 - 10:16 AM

Was This Post Helpful? 0

#12 Wimpy

R.I.P. ( Really Intelligent Person, right? )

Reputation: 159

Posts: 1,038
Joined: 02-May 09

Re: oop php - categories ( on mouse over show 5 subcats )

Posted 25 May 2009 - 10:26 AM

You can't put javascript in a PHP file like that!

Here's a sample page I just created, save it as test.html and run it in your browser:

<html>
	<head>
		<title>Test Page</title>
		<script type="text/javascript">
			function SetListener(dElement, dEvent, dFunction)
			{
				if(window.addEventListener) // Mozilla/Standard
				{
					dElement.addEventListener(dEvent, dFunction, false);
				}
				else if(window.attachEvent) // IE
				{
					dElement.attachEvent('on' + dEvent, dFunction);
				}
			}

			function GetClassPattern(dClass)
			{
				return new RegExp('(^| )' + dClass + '( |$)');
			}

			function GetElement(dEventObject)
			{
				if(dEventObject.target) // Mozilla/Standard
				{
					return dEventObject.target;
				}
				else if(dEventObject.srcElement) // IE
				{
					return dEventObject.srcElement;
				}
				else
				{
					return false;
				}
			}

			function OpenCloseSubcategory(dEventObject)
			{
				var dElement = GetElement(dEventObject);
				if(dElement == false)
					return;
				if(document.getElementById('sub_'+dElement.id))
				{
					var subCategory = document.getElementById('sub_'+dElement.id);
					if(subCategory.style.display == 'block')
					{
						subCategory.style.display = "none";
					}
					else
					{
						subCategory.style.display = "block";
					}
				}
			}

			function Init()
			{
				var liArr   = document.getElementsByTagName('li');
				var pattern = GetClassPattern('category');
				var temp	= null;
				for(var i = 0; i < liArr.length; i++)
				{
					if(liArr[i].className && pattern.test(liArr[i].className))
					{
						document.getElementById('sub_' + liArr[i].id).style.display = 'none';;
						SetListener(liArr[i], 'mouseover', OpenCloseSubcategory);
					}
				}
			}
			SetListener(window, 'load', Init);
		</script>
	</head>
	<body>
		<ul id="category_list">
			<li class="category" id="animals">
				Animals
				<ul class="subcategory_list" id="sub_animals">
					<li class="sub" id="Dog">Dog</li>
					<li class="sub" id="Cat">Cat</li>
					<li class="sub" id="Mouse">Mouse</li>
					<li class="sub" id="Horse">Horse</li>
					<li class="sub" id="Bunny">Bunny</li>
				</ul>
			</li>
			<li class="category" id="shapes">
				Shapes
				<ul class="subcategory_list" id="sub_shapes">
					<li class="sub" id="Square">Square</li>
					<li class="sub" id="Circle">Circle</li>
					<li class="sub" id="Triangle">Triangle</li>
				</ul>
			</li>
		</ul>
	</body>
</html>

Hope you get some ideas from it!

This post has been edited by Wimpy: 25 May 2009 - 10:30 AM

Was This Post Helpful? 0

#13 AlienWebguy

D.I.C Head

Reputation: 9

Posts: 84
Joined: 04-March 09

Re: oop php - categories ( on mouse over show 5 subcats )

Posted 25 May 2009 - 10:51 AM

Never use javascript for mouseover menus anymore. Always use CSS.

Check out http://www.michaelreel.com for an example. You can see in the source that it's just a simple HTML list and if you look at the CSS you can see how I structured the :hover properties to allow for the popouts to go however many tiers deep that I predetermine.

As for the PHP to populate it, it's actually documented in another thread here: http://www.dreaminco...showtopic=93006

Hope that helps a bit. Took me a long time to figure it out the first time too

--S--

Was This Post Helpful? 1

#14 Wimpy

R.I.P. ( Really Intelligent Person, right? )

Reputation: 159

Posts: 1,038
Joined: 02-May 09

Re: oop php - categories ( on mouse over show 5 subcats )

Posted 25 May 2009 - 11:10 AM

Sweet!

AlienWebguy, on 25 May, 2009 - 07:51 PM, said:

--S--

Was This Post Helpful? 0

#15 blackpoet

New D.I.C Head

Reputation: 0

Posts: 13
Joined: 20-May 09

Re: oop php - categories ( on mouse over show 5 subcats )

Posted 25 May 2009 - 11:37 AM

AlienWebguy, on 25 May, 2009 - 09:51 AM, said:

--S--

thnx man that realy helped

Was This Post Helpful? 0

(2 Pages)
1
2
→

oop php - categories ( on mouse over show 5 subcats )

Replies To: oop php - categories ( on mouse over show 5 subcats )

Re: oop php - categories ( on mouse over show 5 subcats )

Re: oop php - categories ( on mouse over show 5 subcats )

Re: oop php - categories ( on mouse over show 5 subcats )

Re: oop php - categories ( on mouse over show 5 subcats )

Re: oop php - categories ( on mouse over show 5 subcats )

Re: oop php - categories ( on mouse over show 5 subcats )

Re: oop php - categories ( on mouse over show 5 subcats )

Re: oop php - categories ( on mouse over show 5 subcats )

Re: oop php - categories ( on mouse over show 5 subcats )

Re: oop php - categories ( on mouse over show 5 subcats )

Re: oop php - categories ( on mouse over show 5 subcats )

Re: oop php - categories ( on mouse over show 5 subcats )

Re: oop php - categories ( on mouse over show 5 subcats )

Re: oop php - categories ( on mouse over show 5 subcats )

Follow & Share

Give It A Try!

Reference Sheets

Bye Bye Ads

Monthly Drawing