problems with my checkboxes help me!!!!! [Archive]

View Full Version : problems with my checkboxes help me!!!!!

loislane74

08-07-2008, 08:06 AM

im trying to incorporate javascript on the project im currently working im already loosing my mind and still cant figure this out: the problem is i have an array of checkboxes which has its corresponding textboxes what i want to do is when the form is loaded all the textboxes are disabled but once i clicked on one of the checkboxes it should enable the textbox that goes with it
here is my sample code:

<script language="javascript">
function myFunction()
{
document.myform.qty.disabled = false;
}
</script>

<style type="text/css">

</style>
</head>

<form method="post" action="transaction_process_guest.php" name="myform">
Table Number: <input type="text" name="table_num" size=5><br>
<table border="0" cellspacing="3" cellpadding="3">
<th></th>
<th>Product Name</th>
<th>Product Price</th>
<th>Product Image</th>
<th>Quantity</th>
<?php
include "connection_dbase_settings.php";

$quer = mysql_query("select * from tbl_products order by product_id");
while($row = mysql_fetch_array($quer))
{
$prod_image = $row[image];
echo "<tr><td></td></tr>";
echo "<tr><td><center><input type=\"checkbox\" name=\"order[]\" value=\"$row[product_id]\" onclick=\"myFunction();\"></center></td>";
echo "<td><center>$row[product_name]</center></td>";
echo "<td><center>$row[price]</center></td>";
echo "<td><center><img src=\"http://localhost/CashRegisterPugo/$prod_image\" height=\"50\" width=\"60\"></center></td>";
echo "<td><center><input type=\"text\" name=\"qty[".$row['product_id']."]\" size=\"5\" disabled></center></td></tr>";
}
echo "<tr><td><input type=\"Submit\" value=\"SUBMIT\"></td>";
echo "<td><input type=\"reset\" value=\"CLEAR\"></td></tr>";
?>

codeexploiter

08-07-2008, 09:56 AM

Here is an example program in which you can see the solution you want.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Untitled Document</title>
<style type="text/css">

</style>
<script type="text/javascript">
function eventAttacher(){
for(var i = 0; i < document.forms['f1'].elements.length; i++){
if(document.forms['f1'].elements[i].type === 'checkbox'){
document.forms['f1'].elements[i].onclick = function(){
checkClick(this);
};
}
}
}
function checkClick(obj){
if(obj.checked && obj.nextSibling){
obj.nextSibling.disabled = false;
}else{
obj.nextSibling.disabled = true;
}
}
window.onload = function(){
eventAttacher();
}
</script>
</head>
<body>
<form name="f1">
<input type="checkbox" name="c1" /><input type="text" name="t1" disabled="true"/><br/>
<input type="checkbox" name="c2" /><input type="text" name="t2" disabled="true"/><br/>
<input type="checkbox" name="c3" /><input type="text" name="t3" disabled="true"/><br/>
<input type="checkbox" name="c4" /><input type="text" name="t4" disabled="true"/><br/>
<input type="checkbox" name="c5" /><input type="text" name="t5" disabled="true"/><br/>
</form>
</body>
</html>

When you load the page in the browser all the textboxes will be disabled. Click on the checkbox and the textbox corresponding to that checkbox will be enabled. If you uncheck then the corresponding textbox will be disabled also.

I've tested it in IE7,IE6 and FF 3.0.1

Hope this helps.

loislane74

08-07-2008, 10:11 AM

im working on an array of checkbox as well as textbox will this code stil work?

jscheuer1

08-07-2008, 03:55 PM

Probably, but this should also work:

<script type="text/javascript">

function myFunction(el){
var t = el.form.elements['qty[' + el.value + ']'];
t.disabled = !el.checked;
}

</script>

<style type="text/css">

</style>
</head>

<form method="post" action="transaction_process_guest.php" name="myform">
Table Number: <input type="text" name="table_num" size=5><br>
<table border="0" cellspacing="3" cellpadding="3">
<th></th>
<th>Product Name</th>
<th>Product Price</th>
<th>Product Image</th>
<th>Quantity</th>
<?php
include "connection_dbase_settings.php";

$quer = mysql_query("select * from tbl_products order by product_id");
while($row = mysql_fetch_array($quer))
{
$prod_image = $row[image];
echo "<tr><td></td></tr>";
echo "<tr><td><center><input type=\"checkbox\" name=\"order[]\" value=\"$row[product_id]\" onclick=\"myFunction(this);\"></center></td>";
echo "<td><center>$row[product_name]</center></td>";
echo "<td><center>$row[price]</center></td>";
echo "<td><center><img src=\"http://localhost/CashRegisterPugo/$prod_image\" height=\"50\" width=\"60\"></center></td>";
echo "<td><center><input type=\"text\" name=\"qty[".$row['product_id']."]\" size=\"5\" disabled></center></td></tr>";
}
echo "<tr><td><input type=\"Submit\" value=\"SUBMIT\"></td>";
echo "<td><input type=\"reset\" value=\"CLEAR\"></td></tr>";
?>

Be sure to also add the this keyword as shown in this line:

echo "<tr><td><center><input type=\"checkbox\" name=\"order[]\" value=\"$row[product_id]\" onclick=\"myFunction(this);\"></center></td>";