0
<html>
<head>
<script language="JavaScript">
	var bgcolorSelected = "#cc3333";	
	var bgcolorNotSelected = "#ffffff";
	
	function HighLightTR_a(el){
		if (document.myform.s23.checked == true) {
			el.bgColor=bgcolorSelected;
		} else {
			el.bgColor=bgcolorNotSelected;
		}						
	}
</script>
</head>
<body>
<form name="myform" action="" method="POST">	
<table border="0" cellspacing="1" cellpadding="4" bgcolor="#F2F2F2" >
     <tr align="center"  bgcolor="#FFFFFF">
		<td height="50" width="50" onClick="HighLightTR_x(this);" <?php echo $c[23];?>>
		<input type="checkbox" name="s23" value="x" <?php echo $s[23];?>><br>X
               <img src="images/upuan.jpg" width="50" height="50" name="s22">
</td>
				
	</tr>
</table>
<input type="submit" name="submit" value="Reserve">
</form>
</body>
</html>

i have a table here with a checkbox in it with a picture.

what i want is when a user click the image, the table row will change color and when i click the reserve button, the value of the image will display in the page..

i've tried it but nothing happens..

please help me...

tnx..

2
Contributors
4
Replies
8
Views
7 Years
Discussion Span
Last Post by saiprem
0

Hi, are you looking like this.....

<script language="JavaScript">
	var bgcolorSelected = "#cc3333";	
	var bgcolorNotSelected = "#ff00dd";
	
	function HighLightTR_x(el){
	var check = 'check_'+el;
	var ima = 'image_'+el;
		if(document.getElementById(check).checked == true)
		{
			alert(document.getElementById(ima).src);
			document.getElementById(el).style.background=bgcolorSelected;
		}
		else
		{
			document.getElementById(el).style.background=bgcolorNotSelected;
		}
	}
</script>

<form name="myform" action="" method="POST">	
<table border="1" cellspacing="1" cellpadding="4">
     <tr align="center" id="td_id1" >
		<td height="50" width="150" onClick="javascript:HighLightTR_x('td_id1');">
			<input type="checkbox" id="check_td_id1" name="check_td_id1" value="x">
               <img src="DT.gif" id="image_td_id1" width="50" height="50">
		</td>
	</tr>
	
	<tr align="center" id="td_id2" >
		<td height="50" width="150" onClick="javascript:HighLightTR_x('td_id2');">
			<input type="checkbox"  id="check_td_id2" name="check_td_id2" value="x">
               <img src="DT.gif" id="image_td_id2" width="50" height="50">
		</td>
	</tr>
</table>
<input type="submit" name="submit" value="Reserve">
</form>

Edited by saiprem: n/a

0

The idea is just like that..

but if its possible not to have a checkbox.. instead its only images...

Im going to use it for bus reservation where a passenger choose a seat.

it looks like a more realistic bus seats...

pls. help me

0

i've tried to manipulate the codes that you gave me.. but when i remove the checkbox, the table row doesnt change image

0

i've tried to manipulate the codes that you gave me.. but when i remove the checkbox, the table row doesnt change image

What do you want onclick on the image it should show one color and onclicking on the image again it show show old color, am I right? and there should not be any check boxes....isn't it.

If you are looking for that just get this and try.....I have given in 2 different ways, which one is good for you use it...

<script language="JavaScript">
	var bgcolorSelected = "#cc3333";	
	
	function HighLightTR_x(el){
	
		if(document.getElementById(el).style.background == '')
		{
			document.getElementById(el).style.background = bgcolorSelected;
		}
		else
		{
			document.getElementById(el).style.background = '';
		}
	}
</script>

<form name="myform" action="" method="POST">	
<table border="1" cellspacing="1" cellpadding="4">
     <tr align="center" >
		<td height="50" width="150" id="td_id1" onClick="javascript:HighLightTR_x('td_id1');">
			<input type="checkbox" id="check_td_id1" name="check_td_id1" value="x">
               <img src="DT.gif" id="image_td_id1" width="50" height="50">
		</td>
	</tr>
	
	<tr align="center"  >
		<td height="50" width="150" id="td_id2" onclick="if(this.style.background==''){this.style.background='#ff6669';} else { this.style.background=''; }">
			<input type="checkbox"  id="check_td_id2" name="check_td_id2" value="x">
               <img src="DT.gif" id="image_td_id2" width="50" height="50">
		</td>
	</tr>
</table>
<input type="submit" name="submit" value="Reserve">
</form>

Edited by saiprem: n/a

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.