You are viewing limited content. For full access, please sign in.

Question

Question

sum a check box within a table

Forms
Updated October 14, 2017
asked on October 5, 2017

I have a table that contains two check box fields.  

I would like to able to total how many "Conv. Allowance" and how many "Partner's Programs" are selected.  I will be doing the same thing with the "Meal" column.

Later in the process, I will be using this information for calculations.

I have been playing around with various formulas and JavaScript, but have not been able to get anything even close.

Any ideas on how to accomplish this?

 

0 0

Answer

SELECTED ANSWER
replied on October 11, 2017

Hmm it all looks ok. I can see you have multiple $(document).ready() calls but that shouldn't cause this. Try the code below as is and let me know how it goes.

function countCheck(column,valueToCount)
{
  var count = 0;
  $('#q20 tr td[data-title="'+column+'"] input:checked').each(function()
 {
   if($(this).val() == valueToCount)
   {
    count += 1; 
   }
   
 });
  return count;
}

$(document).ready(function() {
  $(document).on('change','#q20 tr td[data-title="Convention"] input',function(){
    $('.total input[type="text"]').val(countCheck('Convention','Conv. Allowance'));
  });
  
});

 

0 0

Replies

replied on October 5, 2017

Hey,

Threw this together, should do what you are looking for.

function countCheck(column,valueToCount)
{
  var count = 0;
  $('{table_ID} tr td[data-title="'+column+'"] input:checked').each(function()
 {
   if($(this).val() == valueToCount)
   {
    count += 1; 
   }
   
 });
  return count;
}

$(document).ready(function() {
  $(document).on('change','{table_ID} tr input',function(){
    $('{total_ID} input[type="text"]').val(countCheck('Convention',Conv. Allowance'));
  });
  
});

Just replace {table_ID} with the id of your table #q5 or whatever it is and replace {total_ID} with what ever the id of your total text box is.

If you have any issues let me know :)

0 0
View 8 previous replies
replied on October 10, 2017

It doesn't seem to be working for me.  I have been playing with the code to see if I can get it to work, but I am a beginner when it comes to coding.

I have changed {table_ID} in lines 4 and 16.  I have changed {total_ID} in line 17. I used the CSS class for both.  I also tried the ID number.

Is there anything else that needs to be changed?  Have I missed a spot?

function countCheck(column,valueToCount)
{
  var count = 0;
  $('{.table} tr td[data-title="'+column+'"] input:checked').each(function()
 {
   if($(this).val() == valueToCount)
   {
    count += 1; 
   }
   
 });
  return count;
}

$(document).ready(function() {
  $(document).on('change','{.table} tr input',function(){
    $('{.total} input[type="text"]').val(countCheck('Convention',Conv. Allowance'));
  });
  
});

 

0 0
replied on October 10, 2017

Hey,

You will need to remove the { } they were just there to indicate what needed to be changed.

Try this:

function countCheck(column,valueToCount)
{
  var count = 0;
  $('{.table} tr td[data-title="'+column+'"] input:checked').each(function()
 {
   if($(this).val() == valueToCount)
   {
    count += 1; 
   }
   
 });
  return count;
}

$(document).ready(function() {
  $(document).on('change','.table tr input',function(){
    $('.total input[type="text"]').val(countCheck('Convention','Conv. Allowance'));
  });
  
});

 

0 0
replied on October 10, 2017

I was able to get the zero count to produce, but they did not increment when others rows had the same item selected.

0 0
replied on October 10, 2017

oops I missed a bracket >.< round 3

function countCheck(column,valueToCount)
{
  var count = 0;
  $('.table tr td[data-title="'+column+'"] input:checked').each(function()
 {
   if($(this).val() == valueToCount)
   {
    count += 1; 
   }
   
 });
  return count;
}

$(document).ready(function() {
  $(document).on('change','.table tr input',function(){
    $('.total input[type="text"]').val(countCheck('Convention','Conv. Allowance'));
  });
  
});

 

0 0
replied on October 10, 2017

Still no increment...I used the copy & paste feature just to be sure I had it as you do in the last post.  Do I need to change the (column,valueToCount), or the data-title="'+column+' to be more specific to my table? Being new to coding. I'm not sure if these terms are standard.

0 0
replied on October 10, 2017

Can you upload a screenshot of your form from the Javascript/Css page. I need to see the Table selector and column headings.

0 0
replied on October 11, 2017

Here are a couple of snips from the script page, and one from the preview pane.  

The first one is the table and code (starts line 40).   

The second one includes the fields I am putting the info into.  The names will be adjusted.  I just threw them in here to make sure the count worked.  One is a text field and one is a number field.

Here is one more snip of the preview.  It is the bottom of the table and includes the two test fields.  I have selected a couple of items to illustrate what is happening.

Ultimately, I need to total all Conv. Allowance checks and all Partner's Program checks separately and populate fields.

0 0
SELECTED ANSWER
replied on October 11, 2017

Hmm it all looks ok. I can see you have multiple $(document).ready() calls but that shouldn't cause this. Try the code below as is and let me know how it goes.

function countCheck(column,valueToCount)
{
  var count = 0;
  $('#q20 tr td[data-title="'+column+'"] input:checked').each(function()
 {
   if($(this).val() == valueToCount)
   {
    count += 1; 
   }
   
 });
  return count;
}

$(document).ready(function() {
  $(document).on('change','#q20 tr td[data-title="Convention"] input',function(){
    $('.total input[type="text"]').val(countCheck('Convention','Conv. Allowance'));
  });
  
});

 

0 0
replied on October 13, 2017

It worked!  I had to change line 17 slightly.  Due to the fact it is in a table, the value was automatically changed to the following...Conv._Allowance.  I adjusted for the underscore and it processed as desired.

Line 17 now reads:

 $('.total input[type="text"]').val(countCheck('Convention','Conv._Allowance'));

Thanks for your help.  It is appreciated.

 

0 0
replied on October 13, 2017

Back again!  

If I want to do the same thing for the Meal column (2nd column in table), do I just need to change the highlighted lines below, or do I need to change the function countcheck, as well?

 

0 0
replied on October 14, 2017

You are correct. Just copy those lines and change the selector/parameters and you should be good to go :)

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.

Details
Related Posts
Loading ...