Solved

Checkbox will not stayed check

Posted on 2013-12-05
6
340 Views
Last Modified: 2013-12-18
Hello,

I am populating values into a data table by using a check box group. You check the box and a value shows up in the table.  However, I cannot get multiple check boxes  to hold their value of 'checked'  and not get multiple values to display in the table.  Below is my code for the check box.  Thanks for the help
capturetheflag
<script type="text/javascript">
// - jQuery SHOW/HIDE functions
$(document).ready(function(){
		$('#showJobtitles :checkbox').live('click',function() {
		var checkboxVal = $('#showJobtitles :checkbox:checked').val();
		$('.jobTitleCol_'+checkboxVal).toggle();
		$('.jobTitleTD_'+checkboxVal).toggle();
		//$( "p" ).toggle( "slow" );
		//alert(checkboxVal);
		//return this.filter('#showJobtitles, #jobTitleCol_'+checkboxVal+':checkbox').attr("checked", true);
		//$('#showJobtitles :checkbox:checked',true).val();
		//$('.jobTitleTD').toggle();
		return false;
	});
});
</script>

Open in new window

0
Comment
Question by:capturetheflag
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
  • 2
6 Comments
 
LVL 82

Expert Comment

by:leakim971
ID: 39698182
please provide a link to your page or post the RENDERED html (right click on the page in your browser and choose view source)
0
 
LVL 17

Expert Comment

by:OmniUnlimited
ID: 39698202
You are monitoring the click event of every checkbox and toggling every checkbox every time one of them is clicked.  This is the reason you can't get the checkboxes to hold the checks.  If you want values to populate relative to the checkboxes checked, just do an update of the table each time a checkbox is checked, and don't toggle the checkboxes:

<script type="text/javascript">
// - jQuery SHOW/HIDE functions
$(document).ready(function(){
		$('#showJobtitles :checkbox').live('click',function() {
                                        var checkboxVal;
                                        $('#showJobtitles :checkbox:checked').each(function(index) {
		              checkboxVal = $(this).val();
                                              alert(checkboxVal);
                                              // put your table update code here.
                                       });
                                       return false;
	});
});
</script> 

Open in new window

0
 
LVL 1

Author Comment

by:capturetheflag
ID: 39698458
Hello leakim,

Here is the HTML code.

<!--TOA MODULE_ADMIN CONTRACTS AND CONTRACTORS PANEL-->
<!--////////////////// HEADER //////////////////-->
	
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html>
 
	<head>
        <meta HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE" />
        <meta HTTP-EQUIV="PRAGMA" CONTENT="NO-CACHE" />
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <title>Task Order Administration</title>
        <link href="../Library/v1.0/css/dataTables.css" rel="stylesheet" type="text/css" media="screen" />
        <link href="../Library/v1.0/css/colorbox.css" rel="stylesheet" type="text/css" media="screen" />
        <link href="../Library/v1.0/css/navy_silver/jquery-ui.css" rel="stylesheet" type="text/css" media="screen" />
        <link href="../Library/v1.0/css/FEMA_TST_Standard_Styles.css" rel="stylesheet" type="text/css" media="screen" />
        <link href="css/application.css" rel="stylesheet" type="text/css" media="screen" />
        <link href="css/styles-print.css" rel="stylesheet" type="text/css" media="print" />
        
        <!--[if IE]>
            <link href="css/styles-ie.css" rel="stylesheet" type="text/css" media="screen" />
        <![endif]-->
 
        <script src="../Library/v1.0/js/jquery.js" language="javascript"></script>
        <script src="../Library/v1.0/js/jquery-ui.js" language="javascript"></script>
        <script src="../Library/v1.0/js/jquery-timepicker.js" language="javascript"></script>
        <script src="../Library/v1.0/js/dataTables-min.js" language="javascript"></script>
        <script src="../Library/v1.0/js/colorbox-min.js" language="javascript"></script>
        <script src="../Library/v1.0/js/autogrowtextarea.js" language="javascript"></script>
        <script src="../Library/v1.0/js/filterCombo.js" language="javascript"></script>
        <script src="../Library/v1.0/js/global_functions.js" language="javascript"></script>
				<script src="includes/js/functions.js" language="javascript"></script>
        
        
          <script src="../Library/v1.0/js/application_timeout.js" language="javascript"></script>
        
        
    </head>
	<body>
    <div id="skip">
        <a href="#skipnav">Skip Navigation Links - Go to Main Content</a>
    </div>
 
    	<center>
        <div id="container" align="center">
 
        	<div id="roundedBG-T"><div id="roundedBG-TL"></div><div id="roundedBG-TR"></div></div>
        	<div class="clr"></div>
        	<div id="contentBG">
        		<div id="sitewrapper">
       				 <div id="header">
                <div id="FEMA_seal"><img src="images/clear.gif" height="100%" width="100%" alt="FEMA Seal" title="FEMA Seal" /></div>
                 <div id="banner">
                    <div id="application_name"><img src="images/appname.png" border="0" title="Task Order Administration" alt="Task Order Administration" /></div>
                    
                    <div id="user_name">Hello  </div>
                    
                    <div id="ECIM_Logo"><img src="images/clear.gif" height="100%" width="100%" alt="The Enterprise Coordination and Information Management (ECIM) Section of the VA-NPSC serves as the center for Individual Assistance (IA) information management and custom application development.  ECIM develops and maintains information management tools and custom applications that support the National Emergency Management Information System (NEMIS) and NPSC applicant processing through automated data processing solutions." title="The Enterprise Coordination and Information Management (ECIM) Section of the VA-NPSC serves as the center for Individual Assistance (IA) information management and custom application development.  ECIM develops and maintains information management tools and custom applications that support the National Emergency Management Information System (NEMIS) and NPSC applicant processing through automated data processing solutions." /></div>
                 </div>
                </div>
              <div class="clr"></div>
              
              
                  <!--////////////////// TOP NAVIGATION ///////////////////-->
                      
 
<div id="topNavigation">
    <ul>
    	<li class="actions_icon"><a class="showSubNav" href="actionSubNav">Admin</a>
             <ul class="subNav" id="actionSubNav">
                    <li class="admin_icon"><a href="personnel_job_titles.asp">Personnel Job Titles</a></li>
                    <li class="admin_icon"><a href="job_titles.asp">Job Title Assignments</a></li>
                    <li class="admin_icon"><a href="categories.asp">Categories</a></li>
                    <li class="admin_icon"><a href="contractors.asp">Contractors</a></li>
                    <li class="admin_icon"><a href="contracts_contractors.asp">Contracts & Contractors</a></li>
                    <li class="admin_icon"><a href="contracts.asp">Contracts</a></li>
                    <li class="admin_icon"><a href="service_types.asp">Service Types</a></li>
                    <li class="admin_icon"><a href="contract_types.asp">Contract Types</a></li>
             </ul>
      	</li>
 
      	
        <li class="qasp_icon" title="Go to this area to manage disaster contract quality survellience">
        	<a href="qasp.asp" >QASP</a>
        </li>
        
      	<li class="reports_icon" title="Go to this area to view reports">
        	<a href="#">Reports</a>
        </li>
        
    	<li class="tof_icon" title="Go to this area to manage task order funding">
        	<a href="tof.asp" >TOF</a>
        </li>
        
      	<li class="password_icon" title="Go to this area to change your applications password">
        	<a href="https://vsr.dev.fema.net/VACS/pwchange/" target="_blank">Change Password</a>
        </li>
        
      	<li class="email_icon" title="Send an e-mail to ???">
        	<a href="mailto:VA-NPSC-Technical-Solutions-Team@fema.dhs.gov&subject=TOA Help">Contact Us</a>
        </li>
        
      	<li class="logout_icon" title="Log out of this application">
        	<a href="actions.asp?action=logout">Logout</a>
        </li>
    </ul>
</div>
 
                  <!--///////////////// END TOP NAVIGATION /////////////////-->
                      
                    <div id="wrapper">
           
                    <script type="text/javascript"> 
if (typeof jQuery == 'undefined'){
	document.write('<div id="JSError"><img src="images/icons/alert.png" class="icon" title="Javascript required to use this application has failed to load." alt="Javascript required to use this application has failed to load." /> JavaScript required for this application to properly function has failed to load. Please refresh the page to see if this error resolves itself. If this error continues please send an email requesting help.</div><style type="text/css">#content{display: none; }</style>');
}
</script>
<noscript>
	<div id="JSError">
    	<img src="images/icons/alert.png" class="icon" title="Javascript must be enabled to use this application." alt="Javascript must be enabled to use this application." /> JavaScript must be enabled to use this application. Please enable JavaScript and refresh the page to continue.
    </div>
    <style type="text/css">
		#content{display: none; }
    </style>
</noscript>
                    
                        <div id="content">
                            <a name="top"></a>
                            <a name="skipnav"></a>
                            
<!--//////////////// END HEADER ////////////////-->
 
<!--/////////////// MAIN CONTENT ///////////////-->
<h1 class="pageHeader">Personnel Job Titles</h1>
 
<script type="text/javascript"> 
// - jQuery SHOW/HIDE functions
//$(document).ready(function(){
//		$('#showJobtitles :checkbox').live('click',function() {
//		var checkboxVal = $('#showJobtitles :checkbox:checked').val();
//		$('.jobTitleCol_'+checkboxVal).toggle();
//		$('.jobTitleTD_'+checkboxVal).toggle();
		//$( "p" ).toggle( "slow" );
		//alert(checkboxVal);
		//return this.filter('#showJobtitles, #jobTitleCol_'+checkboxVal+':checkbox').attr("checked", true);
		//$('#showJobtitles :checkbox:checked',true).val();
		//$('.jobTitleTD').toggle();
//		return false;
//	});
//});
</script>
 
<script type="text/javascript"> 
// - jQuery SHOW/HIDE functions
$(document).ready(function(){
		$('#showJobtitles :checkbox').live('click',function() {
                                        var checkboxVal;
                                        $('#showJobtitles :checkbox:checked').each(function(index) {
		              checkboxVal = $(this).val();
                                              //alert(checkboxVal);
	$('.jobTitleCol_'+checkboxVal).toggle();
	$('.jobTitleTD_'+checkboxVal).toggle();
                                              // put your table update code here.
                                       });
                                       //return false;
	});
});
</script> 
                                            
 
 
 
 
<div id="content">              
 
 
 
<form method="link" action="insert_personnel_job_titles.asp" title="Add Personnel Job Titles">		
<input type="submit" class="button iconRight add_personnel_job_titles" id="add_personnel_job_titles" value="Add Personnel Job Titles" style="background-image: url(images/icons/add.png);" alt="Add Personnel Job Titles" title="Add Personnel Job Titles"/>
</form>
<div id="showJobtitles"><span><b>Show Job Titles:&nbsp;</b></span><input type="checkbox" value="15"/>&nbsp;AAAAAAAAAAAAA&nbsp;<input type="checkbox" value="2"/>&nbsp;COTR&nbsp;<input type="checkbox" value="1"/>&nbsp;Contracting Officer&nbsp;<input type="checkbox" value="3"/>&nbsp;Inspection Services Coordinator&nbsp;<input type="checkbox" value="11"/>&nbsp;JOB TITLE 1 TEST&nbsp;<input type="checkbox" value="10"/>&nbsp;JOB TITLE 2 TEST&nbsp;<input type="checkbox" value="4"/>&nbsp;Project Head&nbsp;<input type="checkbox" value="5"/>&nbsp;Project Officer&nbsp;<input type="checkbox" value="8"/>&nbsp;TEST222&nbsp;<input type="checkbox" value="9"/>&nbsp;TESTERaaa&nbsp;<input type="checkbox" value="6"/>&nbsp;Task Monitor&nbsp;<input type="checkbox" value="13"/>&nbsp;a&nbsp;<input type="checkbox" value="7"/>&nbsp;abc&nbsp;<input type="checkbox" value="12"/>&nbsp;x&nbsp;<input type="checkbox" value="14"/>&nbsp;xxxxxxxxxxxxxx&nbsp;<div><a href="#">Save as default view</a></div></div><div style="clear:both;"></div>
 
 
<div id="personnel_list_area" style="margin-top: 2em; background-color: #CCC">
<table id="personnel_list" cellpadding="0" cellspacing="0" border="0">
<thead>
	<tr>
    <th scope="col"></th>
	<th scope="col">Name</th>
    <th scope="col">Active?</th>
    <th scope="col">Nemis ID</th>
 
 
 
              		 <th scope="col" style="display: none" class="jobTitleCol_15">AAAAAAAAAAAAA</th>
              
 
              		 <th scope="col" style="display: none" class="jobTitleCol_2">COTR</th>
              
 
              		 <th scope="col" style="display: none" class="jobTitleCol_1">Contracting Officer</th>
              
 
              		 <th scope="col" style="display: none" class="jobTitleCol_3">Inspection Services Coordinator</th>
              
 
              		 <th scope="col" style="display: none" class="jobTitleCol_11">JOB TITLE 1 TEST</th>
              
 
              		 <th scope="col" style="display: none" class="jobTitleCol_10">JOB TITLE 2 TEST</th>
              
 
              		 <th scope="col" style="display: none" class="jobTitleCol_4">Project Head</th>
              
 
              		 <th scope="col" style="display: none" class="jobTitleCol_5">Project Officer</th>
              
 
              		 <th scope="col" style="display: none" class="jobTitleCol_8">TEST222</th>
              
 
              		 <th scope="col" style="display: none" class="jobTitleCol_9">TESTERaaa</th>
              
 
              		 <th scope="col" style="display: none" class="jobTitleCol_6">Task Monitor</th>
              
 
              		 <th scope="col" style="display: none" class="jobTitleCol_13">a</th>
              
 
              		 <th scope="col" style="display: none" class="jobTitleCol_7">abc</th>
              
 
              		 <th scope="col" style="display: none" class="jobTitleCol_12">x</th>
              
 
              		 <th scope="col" style="display: none" class="jobTitleCol_14">xxxxxxxxxxxxxx</th>
              
 
 
    </tr>    
</thead>
<tbody>
     
       
	<tr>
		<td><a href="update_personnel_job_titles.asp?personnel_id=3&user_id=YBEAR"><img src="images/icons/edit.png" border="0"/></a></td>
 
    <td>Yogi &nbsp;  &nbsp; Bear </td>
    <td>
		
		<img src="images/icons/check.png" border="0"/>
		
    </td>
    <td>YBEAR--3</td> 
 
 
 
                      
                       <td style="display:none;" class="jobTitleTD_15"> 
                       
								
                                      
                                        <img src="images/icons/check.png" border="0"/>
 
                                      
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_2"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_1"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_3"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_11"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_10"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_4"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_5"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_8"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_9"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_6"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_13"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_7"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_12"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_14"> 
                       
								
                        </td>
                
                     
       
	<tr>
		<td><a href="update_personnel_job_titles.asp?personnel_id=2&user_id=DDUCK"><img src="images/icons/edit.png" border="0"/></a></td>
 
    <td>Donald &nbsp;  &nbsp; Duck </td>
    <td>
		
		<img src="images/icons/check.png" border="0"/>
		
    </td>
    <td>DDUCK--2</td> 
 
 
 
                      
                       <td style="display:none;" class="jobTitleTD_15"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_2"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_1"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_3"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_11"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_10"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_4"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_5"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_8"> 
                       
								
                                      
                                        <img src="images/icons/check.png" border="0"/>
 
                                      
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_9"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_6"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_13"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_7"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_12"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_14"> 
                       
								
                        </td>
                
                     
       
	<tr>
		<td><a href="update_personnel_job_titles.asp?personnel_id=1&user_id=MMOUSE"><img src="images/icons/edit.png" border="0"/></a></td>
 
    <td>Mickey &nbsp;  &nbsp; Mouse </td>
    <td>
		
		<img src="images/icons/check.png" border="0"/>
		
    </td>
    <td>MMOUSE--1</td> 
 
 
 
                      
                       <td style="display:none;" class="jobTitleTD_15"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_2"> 
                       
								
                                      
                                        <img src="images/icons/check.png" border="0"/>
 
                                      
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_1"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_3"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_11"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_10"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_4"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_5"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_8"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_9"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_6"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_13"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_7"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_12"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_14"> 
                       
								
                        </td>
                
                     
       
	<tr>
		<td><a href="update_personnel_job_titles.asp?personnel_id=4&user_id=CRELLA"><img src="images/icons/edit.png" border="0"/></a></td>
 
    <td>Cindy &nbsp;  &nbsp; Rella </td>
    <td>
		
		<img src="images/icons/check.png" border="0"/>
		
    </td>
    <td>CRELLA--4</td> 
 
 
 
                      
                       <td style="display:none;" class="jobTitleTD_15"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_2"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_1"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_3"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_11"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_10"> 
                       
								
                                      
                                        <img src="images/icons/check.png" border="0"/>
 
                                      
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_4"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_5"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_8"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_9"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_6"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_13"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_7"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_12"> 
                       
								
                        </td>
                
                 
                      
                       <td style="display:none;" class="jobTitleTD_14"> 
                       
								
                        </td>
                
                 
</tbody>
</table>
 
		
        
</div>
 
 
 
<script type="text/javascript"> 
$("document").ready(function () {
	$("#personnel_list").dataTable({
		bJQueryUI: true
	});	
});
</script>
 
</div> <!--end content-->
<!--///////////// END MAIN CONTENT /////////////-->
 
<!--////////////////// FOOTER //////////////////-->
		</div>
		</div>
 
            </div>
                <div class="clr"></div>
                    <div id="footer">
                    	<ul class="errorDetail">
                      	<li>
                        	<img src="images/icons/page_load_error.png" class="icon" alt="Page loaded in 0.031 seconds with the following error(s): Permission denied" title="Page loaded in 0.031 seconds with the following error(s): Permission denied" /> 
                        </li>
                      </ul>
                    	<ul class="version">
                      	<li>
                        	Task Order Administration Version 4.0 - Development
                        </li>
                      </ul>
                      <ul class="contact">
	                      <li><a href="http://on.fema.net/programs/orr_programs/recovery_programs/npscs/information_mgmt/TST_App_User_Guides/TOA_Release_Notes.txt" target="_blank"><img src="images/icons/release_notes.png" class="icon" alt="View the Task Order Administration release notes" title="View the Task Order Administration release notes" /> Release Notes</a></li>
                      	<li><a href="http://on.fema.net/programs/orr_programs/recovery_programs/npscs/information_mgmt/TST_App_User_Guides/Forms/TOA.aspx" target="_blank"><img src="images/icons/user_manual.png" class="icon" alt="View the Task Order Administration user documentation" title="View the Task Order Administration user documentation" /> User Guides</a></li>
                        <li><a href="mailto:VA-NPSC-Technical-Solutions-Team@fema.dhs.gov&subject=TOA Help"><img src="images/icons/help.png" class="icon" alt="Send an email to request help" title="Send an email to request help"/> Help</a></li>
                      </ul>
                    </div>
                <div class="clr"></div>
                </div>
            <div id="roundedBG-B"><div id="roundedBG-BL"></div><div id="roundedBG-BR"></div></div>
		</div>
                
    </center>
 
	</body>
</html>
<!--//////////////// END FOOTER ////////////////-->
 
 
 

Open in new window

0
What Is Transaction Monitoring and who needs it?

Synthetic Transaction Monitoring that you need for the day to day, which ensures your business website keeps running optimally, and that there is no downtime to impact your customer experience.

 
LVL 17

Expert Comment

by:OmniUnlimited
ID: 39698481
Hmm.  Maybe I didn't explain myself very well.

Ok, let's try this:  you stated:

You check the box and a value shows up in the table.

Can you show me which code is placing the value in the table?
0
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 39698529
Please note $.live deprecated since jQuery 1.9 (it's not really a problem for you currently)
You can use $.on instead.
With checkbox use change instead click event because user can change checkbox state with their keyboard for example.

Test page : http://jsfiddle.net/23SnA/

// - jQuery SHOW/HIDE functions
$(document).ready(function(){
    $('#showJobtitles').on("change", ":checkbox", function() {
        $('#showJobtitles :checkbox').each(function(index) {
            var checkboxVal = $(this).val();
            var isChecked = $(this).is(":checked");
            var showORhide = isChecked?"block":"none";
            $('.jobTitleCol_'+checkboxVal).css("display", showORhide);
            $('.jobTitleTD_'+checkboxVal).css("display", showORhide);
        });
    });
});

Open in new window

0
 
LVL 1

Author Closing Comment

by:capturetheflag
ID: 39726446
Hello leakim971,

Thanks for your help.  It worked.
0

Featured Post

Secure Your WordPress Site: 5 Essential Approaches

WordPress is the web's most popular CMS, but its dominance also makes it a target for attackers. Our eBook will show you how to:

Prevent costly exploits of core and plugin vulnerabilities
Repel automated attacks
Lock down your dashboard, secure your code, and protect your users

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

PROBLEM: The other day I was working on adding an ajax request to a webpage that already had a dialog box on the page.  The dialog box was using relative positioning to be positioned next to a form field I had on the page.  Everything was working…
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

734 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question