need urgent help

[confuzedone]

I'm a newbie to php and javascript. I want some checkbox to hide some rows of my table so i did a search and i found a few javascript codes but yet I couldn't make it work the way I wanted it. When I uncheck a checkbox ONLY the first table rows get hidden, the other tables don't? can't I ID some rows? Please I need help

 

My javascript code is:

 

<script type="text/javascript"><!--

function showHideTR(idx,vis) {

  var tbl,row;

  if(document.getElementById && document.getElementsByTagName) {

    tbl = document.getElementById('tbl');

    if(!tbl || (idx >= tbl.getElementsByTagName('tr').length)) return;

    row = tbl.getElementsByTagName('tr')[idx];

  } else if(document.all && document.all.tags) { // IE4 support

    tbl = document.all.tbl;

    if(!tbl || (idx >= tbl.all.tags('tr').length)) return;

    row = tbl.all.tags('tr')[idx];

  }

  if(row) {

    if(!vis) {

      row.style.display = 'none';

    } else {

      // conditional compilation to hide the try-catch blocks from IE4

      /*@cc_on @if(!@_jscript || (@_jscript_version >= 5)) @*/

        try {

          row.style.display = 'table-row';

        } catch(e) {

          row.style.display = 'block';

        }

      /*@elif(@_jscript_version < 5)

        row.style.display = 'block'; // for IE4

      @end @*/

    }

  }

}

function getStyle(el,styleProp)

{

var x = (typeof(el)=='string')?document.getElementById(el):el;

if (x.currentStyle)

var y = x.currentStyle[styleProp];

else if (window.getComputedStyle)

var y = document.defaultView.getComputedStyle(x,null).getPropertyValue(styleProp);

return y;

}

window.onload = function() {

  if(!document.getElementsByTagName) return;

  var tds = document.getElementsByTagName('td');

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

    tds.onclick = function() {

      alert(this.parentNode.tagName+' = display : '+getStyle(this.parentNode,'display')+

        '\n'+this.tagName+' = display : '+getStyle(this,'display'));

    }

  }

}

// -->

</script>

 

<!-- <script type="text/javascript">

function showHideTR(idx,vis) {

  var tbl,val;

  val = (!vis)?'none'(document.defaultCharset && !window.home)?'block':

    'table-row');

  if(document.getElementById && document.getElementsByTagName) {

    tbl = document.getElementById('tbl');

    if(idx >= tbl.getElementsByTagName('tr').length) return;

    tbl.getElementsByTagName('tr')[idx].style.display = val;

  } else if(document.all && document.all.tags) { // IE4 support

    tbl = document.all.tbl;

    if(idx >= tbl.all.tags('tr').length) return;

    tbl.all.tags('tr')[idx].style.display = val;

  }

}

</script> -->

 

My option tags:

 

<form action="#" onsubmit="return false;">

<ul>

<li2><label for="cb0"><input type="checkbox" id="cb0" checked="checked"

  onclick="showHideTR(0,this.checked);"> Blah Blah</label></li>

<li2><label for="cb1"><input type="checkbox" id="cb1" checked="checked"

  onclick="showHideTR(1,this.checked);"> Blah Blah2</label></li>

<li2><label for="cb2"><input type="checkbox" id="cb2" checked="checked"

  onclick="showHideTR(2,this.checked);"> Blah Blah3</label></li>

<li2><label for="cb3"><input type="checkbox" id="cb1" checked="checked"

  onclick="showHideTR(3,this.checked);"> Blah Blah4</label></li>

</ul>

</form>

 

My php page:

 

<?php

 

$host = "localhost"; // your host name

$username = "blah blah"; // your user name to access MySql

$password = "blah blah"; // your password to access MySql

$database = "blah blah"; // The name of the database

$no = $_POST["sureno"];

 

//$link = mysql_connect($host,$username,$password);

if (!$link  = @mysql_connect($host,$username,$password,true))

{die('Could not connect:'. mysql_error()); }

 

@mysql_query("SET NAMES 'latin5'");

@mysql_select_db($database) or die( "Unable to select database");

$sql="SELECT *

FROM blah blah

WHERE sure = '$no'

ORDER BY 'id'";

 

$result = mysql_query($sql);

if (!$result) {

die('Invalid query: ' . mysql_error());

}

 

while($row=mysql_fetch_assoc($result)){

$bgcolor="#f1f1f1";

echo "<TABLE width=50% align=center cellpadding=0 cellspacing=0 id='tbl' summary='demonstration'> <tr>";

echo "<td bgcolor='dfdfdf' ><font face='arial,verdana,helvetica' color='#000000' size='3'>blah blah</font></td>";

echo "<td bgcolor='C0C0C0' ><font face='arial,verdana,helvetica' color='#FF0000' size='4'>" . $row['AB'] ."</font></td></tr>";

echo "<tr><td bgcolor='dfdfdf' ><font face='arial,verdana,helvetica' color='#000000' size='3'>blah blah</font></td>";

echo "<td bgcolor='dfdfdf'> <font face='arial,verdana,helvetica' color='#0080C0' size='2'>". $row['TR'] ."</font></td></tr>";

echo "<tr><td bgcolor='dfdfdf' ><font face='arial,verdana,helvetica' color='#000000' size='3'>blah blah</font></td>";

echo "<td bgcolor='dfdfdf' id='cb0'> <font face='arial,verdana,helvetica' color='#000000' size='3'>". $row['ML'] ."</font></td></tr>";

 

}

mysql_free_result($result);

 

?>

[JustLikeIcarus]

You cant have multiple elements with the same "id" attribute.  Looks like all your tables have an id of "tbl" this will break getElementById

[confuzedone]

thank you for the reply JustLikeIcarus. How can change my table ids then? Is it not possible?

[KevinM1]

thank you for the reply JustLikeIcarus. How can change my table ids then? Is it not possible?

 

An id is a unique value.  So, give the other tables unique ids.  A simple solution would be something like 'tbl1', 'tbl2', etc.

[confuzedone]

But I'm not creating the tables, php is  It's pulling data out of my database. How can i let it id the tables itself? Sorry if I'm asking too newbie questions 

[JustLikeIcarus]

One issue is that your javascript is hard-coded to 'tbl' as the id so you will need to make it so its dynamic. Try changing your table ids to something like "tbl1", "tbl2" and modify your checkbox function to send the id of the table whos rows you want to hide.

 

In your php just increment a counter to name your tables like

$i = 0;
while($row=mysql_fetch_assoc($result)){
$bgcolor="#f1f1f1";
echo "<TABLE width=50% align=center cellpadding=0 cellspacing=0 id='tbl$i' summary='demonstration'> <tr>";
echo "<td bgcolor='dfdfdf' ><font face='arial,verdana,helvetica' color='#000000' size='3'>blah blah</font></td>";
echo "<td bgcolor='C0C0C0' ><font face='arial,verdana,helvetica' color='#FF0000' size='4'>" . $row['AB'] ."</font></td></tr>";
echo "<tr><td bgcolor='dfdfdf' ><font face='arial,verdana,helvetica' color='#000000' size='3'>blah blah</font></td>";
echo "<td bgcolor='dfdfdf'> <font face='arial,verdana,helvetica' color='#0080C0' size='2'>". $row['TR'] ."</font></td></tr>";
echo "<tr><td bgcolor='dfdfdf' ><font face='arial,verdana,helvetica' color='#000000' size='3'>blah blah</font></td>";
echo "<td bgcolor='dfdfdf' id='cb0'> <font face='arial,verdana,helvetica' color='#000000' size='3'>". $row['ML'] ."</font></td></tr>";

$i++;

}

[confuzedone]

thank you all for the replies. I could do it