jQuery help

#1
Guest_Jaan_*

Posted 21 March 2009 - 07:51 AM

Guests

I have this:

And I have no idea why it don't work..

<html>

<head>

<style>


body{

	

	font-size: 11px;

	

}


.stats-box-wrapper{

	

	border: 1px #c3c3c3 solid;

	width: 300px;

	

}


.stats-box-header{

	

	border-bottom: 1px #c3c3c3 solid;

	padding: 4px;

	margin: 0px 7px;

	

}


.stats-box-date{

	

	padding: 2px;

	margin: 0px 7px;	

	

}


.stats-box-date-overall{

	

	padding: 2px;

	margin: 0px 7px;

	float: right;

	

}


.stats-box-date-today{

	

	padding: 2px;

	margin: 0px 7px;

	float: left;

		

	

}


.minimize-stats-box{

	

	float: right;


}


a{

	

	text-decoration: none;

	

}


</style>


<script type="text/javascript" src="jquery-1.3.2.min.js"></script>


<script type="text/javascript">


$(function() {

       $('.expand').click(function(){

         $(this).next('.stats-content').toggle(1500);

	});

});


</script>


<script type="text/javascript">


function exp(obj) {


	if(obj.oldText){

		obj.innerHTML = obj.oldText;

		obj.oldText = null;

	} else {

		obj.oldText = obj.innerHTML;

		obj.innerHTML = '+';

	}


}


</script>


</head>


<body>


<?php



echo "<div class='stats-box-wrapper'>";

	echo "<div class='stats-box-header'>";

	echo "<div class='minimize-stats-box'><a href='#' class='expand' onclick='javascript:exp(this);'>-</a></div>";

	echo "<font><b>Pealkiri</b></font>";

	echo "</div>";

	echo "<div class='stats-content'>";

	echo "<div class='stats-box-date-today'>";

	echo "<font><b>This month</b></font>";

	echo "</div>";

	echo "<div class='stats-box-date-overall'>";

	echo "<font><b>Overall</b></font>";

	echo "</div>";

	echo "<div style='clear:both;'></div>";

	echo "<div class='stats-box-content'>";

	

	echo "<table width='100%'><tr><td width='50%'>";

	

	echo "Proovin lampi ju";

	

	echo "</td><td width='50%'>";

	

	echo "Proov 2 lampi";

	

	echo "</td></tr></table>";

	

	echo "</div>";

	echo "</div>";	

	echo "</div>";


?>


</body>

</html>

#2
Xav

Posted 21 March 2009 - 09:23 AM

Writes binary right handed and hex left handed

Members
13,118 posts

I have never used jQuery, but why have you done this:

<?php


echo "<div class='stats-box-wrapper'>";
    echo "<div class='stats-box-header'>";
    echo "<div class='minimize-stats-box'><a href='#' class='expand' onclick='javascript:exp(this);'>-</a></div>";
    echo "<font><b>Pealkiri</b></font>";
    echo "</div>";
    echo "<div class='stats-content'>";
    echo "<div class='stats-box-date-today'>";
    echo "<font><b>This month</b></font>";
    echo "</div>";
    echo "<div class='stats-box-date-overall'>";
    echo "<font><b>Overall</b></font>";
    echo "</div>";
    echo "<div style='clear:both;'></div>";
    echo "<div class='stats-box-content'>";
    
    echo "<table width='100%'><tr><td width='50%'>";
    
    echo "Proovin lampi ju";
    
    echo "</td><td width='50%'>";
    
    echo "Proov 2 lampi";
    
    echo "</td></tr></table>";
    
    echo "</div>";
    echo "</div>";    
    echo "</div>";

?>

What is the benefit in outputting the whole thing via PHP, as opposed to standard HTML?

Jordan said:

Good members, like yourself, stick around and post for ages to come!
Mr. Xav | Blog | Forums

#3
Guest_Jaan_*

Posted 21 March 2009 - 09:32 AM

Guests

Because I used PHP when i copy & pasted this content thingy.. ;D that's why

#4
Xav

Posted 21 March 2009 - 09:35 AM

Writes binary right handed and hex left handed

Members
13,118 posts

lol

Do you get an error message?

Jordan said:

Good members, like yourself, stick around and post for ages to come!
Mr. Xav | Blog | Forums

#5
Guest_Jaan_*

Posted 21 March 2009 - 10:28 AM

Guests

Nope.. Problem is that it won't toggle this

<div class='stats-content'></div>

#6
Xav

Posted 21 March 2009 - 10:46 AM

Writes binary right handed and hex left handed

Members
13,118 posts

Have you debugged it with Firebug?

Jordan said:

Good members, like yourself, stick around and post for ages to come!
Mr. Xav | Blog | Forums

#7
Guest_Jaan_*

Posted 21 March 2009 - 02:26 PM

Guests

jQuery can't be debugged with firebug ;)
I think.. because I haven't seen any errors

#8
CameronMauch

Posted 31 March 2009 - 05:59 AM

Newbie

Members
3 posts

Jaan said:

I have this:

And I have no idea why it don't work..

<html>

<head>

<style>


body{

	

	font-size: 11px;

	

}


.stats-box-wrapper{

	

	border: 1px #c3c3c3 solid;

	width: 300px;

	

}


.stats-box-header{

	

	border-bottom: 1px #c3c3c3 solid;

	padding: 4px;

	margin: 0px 7px;

	

}


.stats-box-date{

	

	padding: 2px;

	margin: 0px 7px;	

	

}


.stats-box-date-overall{

	

	padding: 2px;

	margin: 0px 7px;

	float: right;

	

}


.stats-box-date-today{

	

	padding: 2px;

	margin: 0px 7px;

	float: left;

		

	

}


.minimize-stats-box{

	

	float: right;


}


a{

	

	text-decoration: none;

	

}


</style>


<script type="text/javascript" src="jquery-1.3.2.min.js"></script>


<script type="text/javascript">


$(function() {

       $('.expand').click(function(){

         $(this).next('.stats-content').toggle(1500);

	});

});


</script>


<script type="text/javascript">


function exp(obj) {


	if(obj.oldText){

		obj.innerHTML = obj.oldText;

		obj.oldText = null;

	} else {

		obj.oldText = obj.innerHTML;

		obj.innerHTML = '+';

	}


}


</script>


</head>


<body>


<?php



echo "<div class='stats-box-wrapper'>";

	echo "<div class='stats-box-header'>";

	echo "<div class='minimize-stats-box'><a href='#' class='expand' onclick='javascript:exp(this);'>-</a></div>";

	echo "<font><b>Pealkiri</b></font>";

	echo "</div>";

	echo "<div class='stats-content'>";

	echo "<div class='stats-box-date-today'>";

	echo "<font><b>This month</b></font>";

	echo "</div>";

	echo "<div class='stats-box-date-overall'>";

	echo "<font><b>Overall</b></font>";

	echo "</div>";

	echo "<div style='clear:both;'></div>";

	echo "<div class='stats-box-content'>";

	

	echo "<table width='100%'><tr><td width='50%'>";

	

	echo "Proovin lampi ju";

	

	echo "</td><td width='50%'>";

	

	echo "Proov 2 lampi";

	

	echo "</td></tr></table>";

	

	echo "</div>";

	echo "</div>";	

	echo "</div>";


?>


</body>

</html>

The issue is actually pretty simple. The .next gives the next matching sibling, meaning at the same level. For this to work, the element with the 'stats-content' class would have to be after the anchor element inside the same div. It is in a completely different div. If I am having trouble, I usually use firebug's console.log command to display data down the jquery chain. For example, I would log $(this).next('.stats-content').html() to make sure I was getting what I expected. You would see 'undefined' because there was no match. I would replace above with just $('.stats-content'). Don't really need $(this).

Cameron