Results 1 to 4 of 4

Thread: problems with my checkboxes help me!!!!!

  1. #1
    Join Date
    Aug 2008
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default problems with my checkboxes help me!!!!!

    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:

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

        <style type="text/css"> 
    <!-- 
    .style4 {font-size: 36px} 
    .style5 {font-size: large} 
    --> 
        </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>"
    ?>

  2. #2
    Join Date
    Sep 2005
    Location
    India
    Posts
    1,627
    Thanks
    6
    Thanked 107 Times in 107 Posts

    Default

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

    Code:
    <!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.
    Last edited by codeexploiter; 08-07-2008 at 09:58 AM. Reason: Correction

  3. #3
    Join Date
    Aug 2008
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

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

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Probably, but this should also work:

    Code:
    <script type="text/javascript">
    
    function myFunction(el){
    var t = el.form.elements['qty[' + el.value + ']'];
    t.disabled = !el.checked; 
    }  
    
    </script>
    
        <style type="text/css">  
    <!--  
    .style4 {font-size: 36px}  
    .style5 {font-size: large}  
    -->  
        </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:

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

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •