madddidley
08-23-2005, 01:35 PM
Is there a way to get the id of an element, such as a list or something.
thanks,
Matt
www.maddDidley.com
thanks,
Matt
www.maddDidley.com
Click to See Complete Forum and Search --> : Get id of an Element
Fang
08-23-2005, 02:25 PM
Can you be more specific.
madddidley
08-23-2005, 10:18 PM
The reason I ask is because I am making a vertical drop down menu. It is dynamic, driven by mysql. There are categories then there are sub categories these would be the links. I am trying to make it drop down dynamically with javascript.
I can post my code. Its pretty scrambled. Maybe I should, there has got to be an easier way to do this.
<html>
<head>
<title>Drop down menu</title>
<style>
<?PHP //////////////////////////////////////////////////////////////////////////////////////////DYNAMIC CSS HIDE PRODUCTS
$gp=mysql_query("SELECT category, product from products order by product asc");
echo mysql_error();
while($g=mysql_fetch_array($gp)) {
$label=substr($g[category], 0, 2);
if($label != $lastlabel) {
echo "#p_$label {display: none;}\n";
$lastlabel=$label;
}
}
?>
</style>
<script>
<?PHP /////////////////////////////////////////////////////////////////////////////////////DYNAMIC JAVASCRIPT FUNCTION
$cg=mysql_query("SELECT category, product from products order by product asc");
echo mysql_error();
while($b=mysql_fetch_array($cg)) {
}
?>
function hideProduct() {
document.getElementById("p_Cu").style.display = "none";
}
</script>
</head>
<body>
<?PHP
$category=mysql_query("SELECT * from products order by category, product ASC");
$cnum=mysql_num_rows($category);
echo mysql_error();
echo "<ul>";
$count=1;
while($a=mysql_fetch_array($category)) {
if($a[category] != $lastcategory) {
echo "<li><a href=\"#?productId=$a[productId]\" onMouseOver=\"showProduct();\" onMouseOut=\"hideProduct();\">$a[category]</a></li>";
$lastcategory=$a[category];
}
//if($a[product] != $lastproduct) {
$label=substr($a[category], 0, 2);
echo "<ul id=\"p_$label\"><li>$a[product]</li></ul>";
//$lastproduct=$a[product];
//}
$count++;
}
echo "</ul>";
?>
</body>
</html>
I can post my code. Its pretty scrambled. Maybe I should, there has got to be an easier way to do this.
<html>
<head>
<title>Drop down menu</title>
<style>
<?PHP //////////////////////////////////////////////////////////////////////////////////////////DYNAMIC CSS HIDE PRODUCTS
$gp=mysql_query("SELECT category, product from products order by product asc");
echo mysql_error();
while($g=mysql_fetch_array($gp)) {
$label=substr($g[category], 0, 2);
if($label != $lastlabel) {
echo "#p_$label {display: none;}\n";
$lastlabel=$label;
}
}
?>
</style>
<script>
<?PHP /////////////////////////////////////////////////////////////////////////////////////DYNAMIC JAVASCRIPT FUNCTION
$cg=mysql_query("SELECT category, product from products order by product asc");
echo mysql_error();
while($b=mysql_fetch_array($cg)) {
}
?>
function hideProduct() {
document.getElementById("p_Cu").style.display = "none";
}
</script>
</head>
<body>
<?PHP
$category=mysql_query("SELECT * from products order by category, product ASC");
$cnum=mysql_num_rows($category);
echo mysql_error();
echo "<ul>";
$count=1;
while($a=mysql_fetch_array($category)) {
if($a[category] != $lastcategory) {
echo "<li><a href=\"#?productId=$a[productId]\" onMouseOver=\"showProduct();\" onMouseOut=\"hideProduct();\">$a[category]</a></li>";
$lastcategory=$a[category];
}
//if($a[product] != $lastproduct) {
$label=substr($a[category], 0, 2);
echo "<ul id=\"p_$label\"><li>$a[product]</li></ul>";
//$lastproduct=$a[product];
//}
$count++;
}
echo "</ul>";
?>
</body>
</html>
Ultimater
08-23-2005, 10:56 PM
If I understand you right, something like this:
PHP part:
<?PHP
$category=mysql_query("SELECT * from products order by category, product ASC");
$cnum=mysql_num_rows($category);
echo mysql_error();
echo "<ul>";
$count=1;
while($a=mysql_fetch_array($category)) {
//if($a[product] != $lastproduct) {
$label=substr($a[category], 0, 2);
echo "<ul id=\"p_$label\"><li>$a[product]</li></ul>";
//$lastproduct=$a[product];
//}
if($a[category] != $lastcategory) {
echo "<li><a href=\"#?productId=$a[productId]\" onMouseOver=\"showProduct(\'p_$label\');\" onMouseOut=\"hideProduct(\'p_$label\');\">$a[category]</a></li>";
$lastcategory=$a[category];
}
$count++;
}
echo "</ul>";
?>
JavaScript part:
<script type="text/javascript">
function hideProduct() {
document.getElementById(arguments[0]).style.display = "none";
}
function showProduct(){
document.getElementById(arguments[0]).style.display = "block";
}
</script>
I'm not sure what you are trying to do with this:
<?PHP /////////////////////////////////////////////////////////////////////////////////////DYNAMIC JAVASCRIPT FUNCTION
$cg=mysql_query("SELECT category, product from products order by product asc");
echo mysql_error();
while($b=mysql_fetch_array($cg)) {
//What are you trying to do inside this loop?
}
?>
PHP part:
<?PHP
$category=mysql_query("SELECT * from products order by category, product ASC");
$cnum=mysql_num_rows($category);
echo mysql_error();
echo "<ul>";
$count=1;
while($a=mysql_fetch_array($category)) {
//if($a[product] != $lastproduct) {
$label=substr($a[category], 0, 2);
echo "<ul id=\"p_$label\"><li>$a[product]</li></ul>";
//$lastproduct=$a[product];
//}
if($a[category] != $lastcategory) {
echo "<li><a href=\"#?productId=$a[productId]\" onMouseOver=\"showProduct(\'p_$label\');\" onMouseOut=\"hideProduct(\'p_$label\');\">$a[category]</a></li>";
$lastcategory=$a[category];
}
$count++;
}
echo "</ul>";
?>
JavaScript part:
<script type="text/javascript">
function hideProduct() {
document.getElementById(arguments[0]).style.display = "none";
}
function showProduct(){
document.getElementById(arguments[0]).style.display = "block";
}
</script>
I'm not sure what you are trying to do with this:
<?PHP /////////////////////////////////////////////////////////////////////////////////////DYNAMIC JAVASCRIPT FUNCTION
$cg=mysql_query("SELECT category, product from products order by product asc");
echo mysql_error();
while($b=mysql_fetch_array($cg)) {
//What are you trying to do inside this loop?
}
?>
madddidley
08-24-2005, 08:54 AM
In that last part I was trying to do some dynamic javascript but said forget it.
On this part
<script type="text/javascript">
function hideProduct() {
document.getElementById(arguments[0]).style.display = "none";
}
function showProduct(){
document.getElementById(arguments[0]).style.display = "block";
}
</script>
I am getting an error. Should there be quotes in the getElementBId?
And on this part I need the category to print first
<?PHP
$category=mysql_query("SELECT * from products order by category, product ASC");
$cnum=mysql_num_rows($category);
echo mysql_error();
echo "<ul>";
$count=1;
while($a=mysql_fetch_array($category)) {
//if($a[product] != $lastproduct) {
$label=substr($a[category], 0, 2);
echo "<ul id=\"p_$label\"><li>$a[product]</li></ul>";
//$lastproduct=$a[product];
//}
if($a[category] != $lastcategory) {
echo "<li><a href=\"#?productId=$a[productId]\" onMouseOver=\"showProduct(\'p_$label\');\" onMouseOut=\"hideProduct(\'p_$label\');\">$a[category]</a></li>";
$lastcategory=$a[category];
}
$count++;
}
echo "</ul>";
?>
Does it need to be like that to work?
On this part
<script type="text/javascript">
function hideProduct() {
document.getElementById(arguments[0]).style.display = "none";
}
function showProduct(){
document.getElementById(arguments[0]).style.display = "block";
}
</script>
I am getting an error. Should there be quotes in the getElementBId?
And on this part I need the category to print first
<?PHP
$category=mysql_query("SELECT * from products order by category, product ASC");
$cnum=mysql_num_rows($category);
echo mysql_error();
echo "<ul>";
$count=1;
while($a=mysql_fetch_array($category)) {
//if($a[product] != $lastproduct) {
$label=substr($a[category], 0, 2);
echo "<ul id=\"p_$label\"><li>$a[product]</li></ul>";
//$lastproduct=$a[product];
//}
if($a[category] != $lastcategory) {
echo "<li><a href=\"#?productId=$a[productId]\" onMouseOver=\"showProduct(\'p_$label\');\" onMouseOut=\"hideProduct(\'p_$label\');\">$a[category]</a></li>";
$lastcategory=$a[category];
}
$count++;
}
echo "</ul>";
?>
Does it need to be like that to work?
madddidley
08-24-2005, 11:48 AM
OK. So I got it to work kind of. Only though I have two products in a category and it only shows one. Here is my complete up-to-date code.
<html>
<head>
<title>Drop down menu</title>
<style>
<?PHP //////////////////////////////////////////////////////////////////////////////////////////DYNAMIC CSS HIDE PRODUCTS
$gp=mysql_query("SELECT category, product from products order by category asc");
echo mysql_error();
while($g=mysql_fetch_array($gp)) {
$label=substr($g[category], 0, 2);
if($label != $lastlabel) {
echo "#p_$label {display: none;}\n";
$lastlabel=$label;
}
}
?>
</style>
<script type="text/javascript">
function showProduct() {
document.getElementById(arguments[0]).style.display = "block";
}
function hideProduct() {
document.getElementById(arguments[0]).style.display = "none";
}
</script>
</head>
<body>
<?PHP
$category=mysql_query("SELECT * from products order by category, product ASC");
$cnum=mysql_num_rows($category);
echo mysql_error();
echo "<ul>\n";
$count=1;
while($a=mysql_fetch_array($category)) {
if($a[category] != $lastcategory) {
$label=substr($a[category], 0, 2);
echo "<li><a href=\"#?productId=$a[productId]\" onMouseOver=\"showProduct('p_$label');\" onMouseOut=\"hideProduct('p_$label');\">$a[category]</a></li>\n";
$lastcategory=$a[category];
}
//if($a[product] != $lastproduct) {
$label=substr($a[category], 0, 2);
echo "<ul id=\"p_$label\"><li>$a[product]</li></ul>\n";
//$lastproduct=$a[product];
//}
$count++;
}
echo "</ul>\n";
?>
</body>
</html>
Here is what I get when I view the source.
<html>
<head>
<title>Drop down menu</title>
<style>
#p_Cu {display: none;}
#p_St {display: none;}
#p_tr {display: none;}
</style>
<script type="text/javascript">
function showProduct() {
document.getElementById(arguments[0]).style.display = "block";
}
function hideProduct() {
document.getElementById(arguments[0]).style.display = "none";
}
</script>
</head>
<body>
<ul>
<li><a href="#?productId=4" onMouseOver="showProduct('p_Cu');" onMouseOut="hideProduct('p_Cu');">Custom Cuts</a></li>
<ul id="p_Cu"><li>door jam thing</li></ul>
<li><a href="#?productId=3" onMouseOver="showProduct('p_St');" onMouseOut="hideProduct('p_St');">Stereo Equipment</a></li>
<ul id="p_St"><li>amp</li></ul>
<ul id="p_St"><li>speakers</li></ul>
<li><a href="#?productId=1" onMouseOver="showProduct('p_tr');" onMouseOut="hideProduct('p_tr');">transmission</a></li>
<ul id="p_tr"><li>thing1</li></ul>
</ul>
</body>
</html>
<html>
<head>
<title>Drop down menu</title>
<style>
<?PHP //////////////////////////////////////////////////////////////////////////////////////////DYNAMIC CSS HIDE PRODUCTS
$gp=mysql_query("SELECT category, product from products order by category asc");
echo mysql_error();
while($g=mysql_fetch_array($gp)) {
$label=substr($g[category], 0, 2);
if($label != $lastlabel) {
echo "#p_$label {display: none;}\n";
$lastlabel=$label;
}
}
?>
</style>
<script type="text/javascript">
function showProduct() {
document.getElementById(arguments[0]).style.display = "block";
}
function hideProduct() {
document.getElementById(arguments[0]).style.display = "none";
}
</script>
</head>
<body>
<?PHP
$category=mysql_query("SELECT * from products order by category, product ASC");
$cnum=mysql_num_rows($category);
echo mysql_error();
echo "<ul>\n";
$count=1;
while($a=mysql_fetch_array($category)) {
if($a[category] != $lastcategory) {
$label=substr($a[category], 0, 2);
echo "<li><a href=\"#?productId=$a[productId]\" onMouseOver=\"showProduct('p_$label');\" onMouseOut=\"hideProduct('p_$label');\">$a[category]</a></li>\n";
$lastcategory=$a[category];
}
//if($a[product] != $lastproduct) {
$label=substr($a[category], 0, 2);
echo "<ul id=\"p_$label\"><li>$a[product]</li></ul>\n";
//$lastproduct=$a[product];
//}
$count++;
}
echo "</ul>\n";
?>
</body>
</html>
Here is what I get when I view the source.
<html>
<head>
<title>Drop down menu</title>
<style>
#p_Cu {display: none;}
#p_St {display: none;}
#p_tr {display: none;}
</style>
<script type="text/javascript">
function showProduct() {
document.getElementById(arguments[0]).style.display = "block";
}
function hideProduct() {
document.getElementById(arguments[0]).style.display = "none";
}
</script>
</head>
<body>
<ul>
<li><a href="#?productId=4" onMouseOver="showProduct('p_Cu');" onMouseOut="hideProduct('p_Cu');">Custom Cuts</a></li>
<ul id="p_Cu"><li>door jam thing</li></ul>
<li><a href="#?productId=3" onMouseOver="showProduct('p_St');" onMouseOut="hideProduct('p_St');">Stereo Equipment</a></li>
<ul id="p_St"><li>amp</li></ul>
<ul id="p_St"><li>speakers</li></ul>
<li><a href="#?productId=1" onMouseOver="showProduct('p_tr');" onMouseOut="hideProduct('p_tr');">transmission</a></li>
<ul id="p_tr"><li>thing1</li></ul>
</ul>
</body>
</html>
Ultimater
08-24-2005, 01:36 PM
This part is bad HTML:
<ul id="p_St"><li>amp</li></ul>
<ul id="p_St"><li>speakers</li></ul>
The id attribute for each tag must be unique unlike the name attribute.
The answer is to use names instead of ids and then use actual classes in your CSS instead of id references because of the lack of ids:
<html>
<head>
<title>Drop down menu</title>
<style type="text/css">
.display_none{display: none;}
</style>
<script type="text/javascript">
function showProduct() {
var els=document.getElementsByName(arguments[0]);
for(var i=0,l=els.length;i<l;i++){
els[i].style.display = "block";
}
}
function hideProduct() {
var els=document.getElementsByName(arguments[0]);
for(var i=0,l=els.length;i<l;i++){
els[i].style.display = "none";
}
}
</script>
</head>
<body>
<ul>
<li><a href="#?productId=4" onMouseOver="showProduct('p_Cu');" onMouseOut="hideProduct('p_Cu');">Custom Cuts</a></li>
<ul name="p_Cu" class="display_none"><li>door jam thing</li></ul>
<li><a href="#?productId=3" onMouseOver="showProduct('p_St');" onMouseOut="hideProduct('p_St');">Stereo Equipment</a></li>
<ul name="p_St" class="display_none"><li>amp</li></ul>
<ul name="p_St" class="display_none"><li>speakers</li></ul>
<li><a href="#?productId=1" onMouseOver="showProduct('p_tr');" onMouseOut="hideProduct('p_tr');">transmission</a></li>
<ul name="p_tr" class="display_none"><li>thing1</li></ul>
</ul>
</body>
</html>
<ul id="p_St"><li>amp</li></ul>
<ul id="p_St"><li>speakers</li></ul>
The id attribute for each tag must be unique unlike the name attribute.
The answer is to use names instead of ids and then use actual classes in your CSS instead of id references because of the lack of ids:
<html>
<head>
<title>Drop down menu</title>
<style type="text/css">
.display_none{display: none;}
</style>
<script type="text/javascript">
function showProduct() {
var els=document.getElementsByName(arguments[0]);
for(var i=0,l=els.length;i<l;i++){
els[i].style.display = "block";
}
}
function hideProduct() {
var els=document.getElementsByName(arguments[0]);
for(var i=0,l=els.length;i<l;i++){
els[i].style.display = "none";
}
}
</script>
</head>
<body>
<ul>
<li><a href="#?productId=4" onMouseOver="showProduct('p_Cu');" onMouseOut="hideProduct('p_Cu');">Custom Cuts</a></li>
<ul name="p_Cu" class="display_none"><li>door jam thing</li></ul>
<li><a href="#?productId=3" onMouseOver="showProduct('p_St');" onMouseOut="hideProduct('p_St');">Stereo Equipment</a></li>
<ul name="p_St" class="display_none"><li>amp</li></ul>
<ul name="p_St" class="display_none"><li>speakers</li></ul>
<li><a href="#?productId=1" onMouseOver="showProduct('p_tr');" onMouseOut="hideProduct('p_tr');">transmission</a></li>
<ul name="p_tr" class="display_none"><li>thing1</li></ul>
</ul>
</body>
</html>
Ultimater
08-24-2005, 01:42 PM
Your up-to-date PHP code should now read as follows, after making my changes:
<html>
<head>
<title>Drop down menu</title>
<style type="text/css>
.display_none{display: none;}
</style>
<script type="text/javascript">
function showProduct() {
var els=document.getElementsByName(arguments[0]);
for(var i=0,l=els.length;i<l;i++){
els[i].style.display = "block";
}
}
function hideProduct() {
var els=document.getElementsByName(arguments[0]);
for(var i=0,l=els.length;i<l;i++){
els[i].style.display = "none";
}
}
</script>
</head>
<body>
<?PHP
$category=mysql_query("SELECT * from products order by category, product ASC");
$cnum=mysql_num_rows($category);
echo mysql_error();
echo "<ul>\n";
$count=1;
while($a=mysql_fetch_array($category)) {
if($a[category] != $lastcategory) {
$label=substr($a[category], 0, 2);
echo "<li><a href=\"#?productId=$a[productId]\" onMouseOver=\"showProduct('p_$label');\" onMouseOut=\"hideProduct('p_$label');\">$a[category]</a></li>\n";
$lastcategory=$a[category];
}
//if($a[product] != $lastproduct) {
$label=substr($a[category], 0, 2);
echo "<ul name=\"p_$label\" class=\"display_none\"><li>$a[product]</li></ul>\n";
//$lastproduct=$a[product];
//}
$count++;
}
echo "</ul>\n";
?>
</body>
</html>
Sorry, I would have used the [php] tag but every instance of \n was being replaced by n when using that tag unlike the [code] tag -- which doesn't have such a glitch in it, I hope that forum glitch gets fixed ASAP!
<html>
<head>
<title>Drop down menu</title>
<style type="text/css>
.display_none{display: none;}
</style>
<script type="text/javascript">
function showProduct() {
var els=document.getElementsByName(arguments[0]);
for(var i=0,l=els.length;i<l;i++){
els[i].style.display = "block";
}
}
function hideProduct() {
var els=document.getElementsByName(arguments[0]);
for(var i=0,l=els.length;i<l;i++){
els[i].style.display = "none";
}
}
</script>
</head>
<body>
<?PHP
$category=mysql_query("SELECT * from products order by category, product ASC");
$cnum=mysql_num_rows($category);
echo mysql_error();
echo "<ul>\n";
$count=1;
while($a=mysql_fetch_array($category)) {
if($a[category] != $lastcategory) {
$label=substr($a[category], 0, 2);
echo "<li><a href=\"#?productId=$a[productId]\" onMouseOver=\"showProduct('p_$label');\" onMouseOut=\"hideProduct('p_$label');\">$a[category]</a></li>\n";
$lastcategory=$a[category];
}
//if($a[product] != $lastproduct) {
$label=substr($a[category], 0, 2);
echo "<ul name=\"p_$label\" class=\"display_none\"><li>$a[product]</li></ul>\n";
//$lastproduct=$a[product];
//}
$count++;
}
echo "</ul>\n";
?>
</body>
</html>
Sorry, I would have used the [php] tag but every instance of \n was being replaced by n when using that tag unlike the [code] tag -- which doesn't have such a glitch in it, I hope that forum glitch gets fixed ASAP!
madddidley
08-24-2005, 02:16 PM
Ok, this is what I have and I don't get any errors but it doesn't do anything.
<?PHP
error_reporting(E_ALL^E_NOTICE);
mysql_connect("localhost");
mysql_select_db("showmestreetcustoms");
?>
<html>
<head>
<title>Drop down menu</title>
<style text="text/css">
.display_none {display: none; }
</style>
<script type="text/javascript">
function showProduct() {
var els=document.getElementsByName(arguments[0]);
for(var i=0,l=els.length;i<l;i++){
els[i].style.display = "block";
}
}
function hideProduct() {
var els=document.getElementsByName(arguments[0]);
for(var i=0,l=els.length;i<l;i++){
els[i].style.display = "none";
}
}
</script>
</head>
<body>
<?PHP
$category=mysql_query("SELECT * from products order by category, product ASC");
$cnum=mysql_num_rows($category);
echo mysql_error();
echo "<ul>\n";
$count=1;
while($a=mysql_fetch_array($category)) {
if($a[category] != $lastcategory) {
$label=substr($a[category], 0, 2);
echo "<li><a href=\"#\" onMouseOver=\"showProduct('p_$label');\" onMouseOut=\"hideProduct('p_$label');\">$a[category]</a></li>\n";
$lastcategory=$a[category];
}
$label=substr($a[category], 0, 2);
echo "<ul name=\"p_$label\" class=\"display_none\"><li>$a[product]</li></ul>\n";
$count++;
}
echo "</ul>\n";
?>
</body>
</html>
<?PHP
error_reporting(E_ALL^E_NOTICE);
mysql_connect("localhost");
mysql_select_db("showmestreetcustoms");
?>
<html>
<head>
<title>Drop down menu</title>
<style text="text/css">
.display_none {display: none; }
</style>
<script type="text/javascript">
function showProduct() {
var els=document.getElementsByName(arguments[0]);
for(var i=0,l=els.length;i<l;i++){
els[i].style.display = "block";
}
}
function hideProduct() {
var els=document.getElementsByName(arguments[0]);
for(var i=0,l=els.length;i<l;i++){
els[i].style.display = "none";
}
}
</script>
</head>
<body>
<?PHP
$category=mysql_query("SELECT * from products order by category, product ASC");
$cnum=mysql_num_rows($category);
echo mysql_error();
echo "<ul>\n";
$count=1;
while($a=mysql_fetch_array($category)) {
if($a[category] != $lastcategory) {
$label=substr($a[category], 0, 2);
echo "<li><a href=\"#\" onMouseOver=\"showProduct('p_$label');\" onMouseOut=\"hideProduct('p_$label');\">$a[category]</a></li>\n";
$lastcategory=$a[category];
}
$label=substr($a[category], 0, 2);
echo "<ul name=\"p_$label\" class=\"display_none\"><li>$a[product]</li></ul>\n";
$count++;
}
echo "</ul>\n";
?>
</body>
</html>
Ultimater
08-24-2005, 04:52 PM
I don't know what your MySQL database has stored in it nor am I the best PHP programmer -- it ain't even worth telling me what's in it either. I did the JavaScript half, now go to the PHP forum and get help from someone that knows PHP, I hardly know any PHP at all -- I'm more a PERL programmer.
madddidley
08-24-2005, 11:03 PM
Thanks for all your help but...
function showProduct() {
var els=document.getElementsByName(arguments[0]);
for(var i=0,l=els.length;i<l;i++){ /////////////////what is l=els.length do
els[i].style.display = "block";
}
}
I'm not sure if I totally understand that part els.length. Is that the length of the of argument or how many arguments there are?
function showProduct() {
var els=document.getElementsByName(arguments[0]);
for(var i=0,l=els.length;i<l;i++){ /////////////////what is l=els.length do
els[i].style.display = "block";
}
}
I'm not sure if I totally understand that part els.length. Is that the length of the of argument or how many arguments there are?
Ultimater
08-25-2005, 12:08 AM
for(var i=0,l=els.length;i<l;i++)
is the same as:
for(var i=0;i<els.length;i++)
except that the second way produces more lag because it checks the length of "els" ever time as apose to checking it once and remembering the length.
els.length means how many elements were matched.
The document.getElementsByName function accepts an argument, the name of the element to search for, then it returns an array of all the elements with the name attribute set to the argument sent to the function.
is the same as:
for(var i=0;i<els.length;i++)
except that the second way produces more lag because it checks the length of "els" ever time as apose to checking it once and remembering the length.
els.length means how many elements were matched.
The document.getElementsByName function accepts an argument, the name of the element to search for, then it returns an array of all the elements with the name attribute set to the argument sent to the function.
madddidley
08-25-2005, 08:12 AM
I just realized that I don't have a doc type. Could that cause a problem?
madddidley
08-25-2005, 02:19 PM
This is what I got and I know the database is ok. I threw an alert in to see what els was and I got [object]. So its not getting the p_$label argument. I don't know if that will help anyone helping me but yeah.
function showProduct() {
var els=document.getElementsByName(arguments[0]);
alert(els);
for(var i=0; i<els.length; i++){ els[i].style.display = "block";
}
}
function showProduct() {
var els=document.getElementsByName(arguments[0]);
alert(els);
for(var i=0; i<els.length; i++){ els[i].style.display = "block";
}
}
Ultimater
08-25-2005, 03:01 PM
You are being stricter than XHTML STRICT on steriods, you are making errors outta perfectly legal code, lol. You should learn what arguments[0] means.
function showProduct() {
alert(arguments[0])
var els=document.getElementsByName(arguments[0]);
for(var i=0; i<els.length; i++){ els[i].style.display = "block";
}
}
<script type="text/javascript">
function testing123(a){
alert(arguments[0])
alert(a)
alert(arguments)
alert(arguments.length)
}
testing123("this is called an argument")
</script>
Btw, what seems to be the problem? You didn't mention anything wrong with my code and you seem to be pulling it appart as though there was an error in it.
function showProduct() {
alert(arguments[0])
var els=document.getElementsByName(arguments[0]);
for(var i=0; i<els.length; i++){ els[i].style.display = "block";
}
}
<script type="text/javascript">
function testing123(a){
alert(arguments[0])
alert(a)
alert(arguments)
alert(arguments.length)
}
testing123("this is called an argument")
</script>
Btw, what seems to be the problem? You didn't mention anything wrong with my code and you seem to be pulling it appart as though there was an error in it.
madddidley
08-25-2005, 04:08 PM
Sorry for about the the stuff. Here is what I see when I view the source. As you can see there are three categories and the "Stereo Equipment" has two products.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Drop down menu</title>
<style text="text/css">
.display_none {display: none; }
</style>
<script type="text/javascript">
function showProduct() {
var els = document.getElementsByName(arguments[0]);
for(i=0; i<els.length; i++){
els[i].style.display = "block";
}
}
function hideProduct() {
var els=document.getElementsByName(arguments[0]);
for(i=0; i<els.length; i++){
els[i].style.display = "none";
}
}
</script>
</head>
<body>
<ul>
<li><a href="#" onMouseOver="showProduct('p_Cu');" onMouseOut="hideProduct('p_Cu');">Custom Cuts</a></li>
<ul name="p_Cu" class="display_none"><li>door jam thing</li></ul>
<li><a href="#" onMouseOver="showProduct('p_St');" onMouseOut="hideProduct('p_St');">Stereo Equipment</a></li>
<ul name="p_St" class="display_none"><li>amp</li></ul>
<ul name="p_St" class="display_none"><li>speakers</li></ul>
<li><a href="#" onMouseOver="showProduct('p_tr');" onMouseOut="hideProduct('p_tr');">transmission</a></li>
<ul name="p_tr" class="display_none"><li>thing1</li></ul>
</ul>
</body>
</html>
Here is my source code and when I view it in the browser nothing happens. Doesn't arguments[0] put the arguments in an array or something. I tried to print it out and it said [object] and not p_St or anything like that.
<?PHP
error_reporting(E_ALL^E_NOTICE);
mysql_connect("localhost");
mysql_select_db("showmestreetcustoms");
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Drop down menu</title>
<style text="text/css">
<?PHP
/*
$gp=mysql_query("SELECT * from products order by category, product asc");
echo mysql_error();
while($g=mysql_fetch_array($gp)) {
$label=substr($g[category], 0, 2);
if($label != $lastlabel) {
echo "#p_$label {display: none;}\n";
$lastlabel=$label;
}
}
*/
?>
.display_none {display: none; }
</style>
<script type="text/javascript">
function showProduct() {
var els = document.getElementsByName(arguments[0]);
for(i=0; i<els.length; i++){
els[i].style.display = "block";
}
}
function hideProduct() {
var els=document.getElementsByName(arguments[0]);
for(i=0; i<els.length; i++){
els[i].style.display = "none";
}
}
</script>
</head>
<body>
<?PHP
$category=mysql_query("SELECT * from products order by category, product ASC");
$cnum=mysql_num_rows($category);
echo mysql_error();
echo "<ul>\n";
$count=1;
while($a=mysql_fetch_array($category)) {
if($a[category] != $lastcategory) {
$label=substr($a[category], 0, 2);
echo "<li><a href=\"#\" onMouseOver=\"showProduct('p_$label');\" onMouseOut=\"hideProduct('p_$label');\">$a[category]</a></li>\n";
$lastcategory=$a[category];
}
$label=substr($a[category], 0, 2);
echo "<ul name=\"p_$label\" class=\"display_none\"><li>$a[product]</li></ul>\n";
$count++;
}
echo "</ul>\n";
?>
</body>
</html>
When I do an alert of the arguments I get p_St or whatever and I think thats good.
function showProduct() {
var arg = arguments[0];
alert(arg);
}
But when I try something like this I get "[object]".
var els = document.getElementsByName(arg);
Thanks,
matt
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Drop down menu</title>
<style text="text/css">
.display_none {display: none; }
</style>
<script type="text/javascript">
function showProduct() {
var els = document.getElementsByName(arguments[0]);
for(i=0; i<els.length; i++){
els[i].style.display = "block";
}
}
function hideProduct() {
var els=document.getElementsByName(arguments[0]);
for(i=0; i<els.length; i++){
els[i].style.display = "none";
}
}
</script>
</head>
<body>
<ul>
<li><a href="#" onMouseOver="showProduct('p_Cu');" onMouseOut="hideProduct('p_Cu');">Custom Cuts</a></li>
<ul name="p_Cu" class="display_none"><li>door jam thing</li></ul>
<li><a href="#" onMouseOver="showProduct('p_St');" onMouseOut="hideProduct('p_St');">Stereo Equipment</a></li>
<ul name="p_St" class="display_none"><li>amp</li></ul>
<ul name="p_St" class="display_none"><li>speakers</li></ul>
<li><a href="#" onMouseOver="showProduct('p_tr');" onMouseOut="hideProduct('p_tr');">transmission</a></li>
<ul name="p_tr" class="display_none"><li>thing1</li></ul>
</ul>
</body>
</html>
Here is my source code and when I view it in the browser nothing happens. Doesn't arguments[0] put the arguments in an array or something. I tried to print it out and it said [object] and not p_St or anything like that.
<?PHP
error_reporting(E_ALL^E_NOTICE);
mysql_connect("localhost");
mysql_select_db("showmestreetcustoms");
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Drop down menu</title>
<style text="text/css">
<?PHP
/*
$gp=mysql_query("SELECT * from products order by category, product asc");
echo mysql_error();
while($g=mysql_fetch_array($gp)) {
$label=substr($g[category], 0, 2);
if($label != $lastlabel) {
echo "#p_$label {display: none;}\n";
$lastlabel=$label;
}
}
*/
?>
.display_none {display: none; }
</style>
<script type="text/javascript">
function showProduct() {
var els = document.getElementsByName(arguments[0]);
for(i=0; i<els.length; i++){
els[i].style.display = "block";
}
}
function hideProduct() {
var els=document.getElementsByName(arguments[0]);
for(i=0; i<els.length; i++){
els[i].style.display = "none";
}
}
</script>
</head>
<body>
<?PHP
$category=mysql_query("SELECT * from products order by category, product ASC");
$cnum=mysql_num_rows($category);
echo mysql_error();
echo "<ul>\n";
$count=1;
while($a=mysql_fetch_array($category)) {
if($a[category] != $lastcategory) {
$label=substr($a[category], 0, 2);
echo "<li><a href=\"#\" onMouseOver=\"showProduct('p_$label');\" onMouseOut=\"hideProduct('p_$label');\">$a[category]</a></li>\n";
$lastcategory=$a[category];
}
$label=substr($a[category], 0, 2);
echo "<ul name=\"p_$label\" class=\"display_none\"><li>$a[product]</li></ul>\n";
$count++;
}
echo "</ul>\n";
?>
</body>
</html>
When I do an alert of the arguments I get p_St or whatever and I think thats good.
function showProduct() {
var arg = arguments[0];
alert(arg);
}
But when I try something like this I get "[object]".
var els = document.getElementsByName(arg);
Thanks,
matt
b_dubb
06-13-2011, 07:44 AM
<html>
<head></head>
<script type="text/javascript">
function passID(varId)
{
var thisRowId = varId.id;
alert( thisRowId );
}
</script>
<body>
<u>
<?php $sql = "SELECT * FROM example"; $query = mysql_query( $sql );
while ( $row = mysql_fetch_array( $query, MYSQL_ASSOC ) ) {
echo '<li><a href="yatta.php" id="resultRow".$row['id']."" onclick=\"passID(this);\">".$row['text']</a></li>
}
?>
</ul>
</body>
</html>
jsFunction(this) will help you pass the ID for whatever 'this' has
<head></head>
<script type="text/javascript">
function passID(varId)
{
var thisRowId = varId.id;
alert( thisRowId );
}
</script>
<body>
<u>
<?php $sql = "SELECT * FROM example"; $query = mysql_query( $sql );
while ( $row = mysql_fetch_array( $query, MYSQL_ASSOC ) ) {
echo '<li><a href="yatta.php" id="resultRow".$row['id']."" onclick=\"passID(this);\">".$row['text']</a></li>
}
?>
</ul>
</body>
</html>
jsFunction(this) will help you pass the ID for whatever 'this' has
webdeveloper.com
Copyright Internet.com Inc., All Rights Reserved.
Copyright Internet.com Inc., All Rights Reserved.