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

Question

Question

Copy the value of a checkbox array

asked on April 23, 2019

I have English and Spanish versions of a form and I want to copy the inputs of all fields into another.  So for example, there's a "First Name" field and a "Primer Nombre" field that both dump their inputs into a hidden field so I can just refer to the one field in the process diagram and reporting.  I fully realize there might be an easier way to accomplish this, but this is how I figured out to do it.

Anyway, this works fine for the single line fields and dropdown menus, but how do I do the same for checkbox/radios?  For example, I have a checkbox field with multiple options (it lets the form filler select any/all ethnicities).  For other field types I'm using something like this:

  $('#q523 input').val($('#q226 input').val()); //Student First Name

What would be the equivalent for checkboxes and radio buttons with multiple options?

0 0

Answer

SELECTED ANSWER
replied on April 24, 2019 Show version history

Hi Dennis,

I think something like the following should do the trick--you will probably need to add some conditional logic, but the below snippets will work to check boxes, depending on your approach to targeting selectors.

Using IDs:

$('input[id="Field44(1)"]').prop("checked", true);
$('input[id="Field44(2)"]').prop("checked", true);
$('input[id="Field44(3)"]').prop("checked", true);
$('input[id="Field44(4)"]').prop("checked", true);

Using classes:

$('.yourClass input[value="val"]').prop('checked', true);
// Where ".yourClass" is the CSS class you apply to the field on the Layout tab, and "val" is the value you assign to the choice.

You will likely need to use a switch or if/else block to check the correct boxes, but the above code should allow you to target them after the logic is evaluated.

Best,

Rob

1 0
replied on April 25, 2019

If I'm reading that right, that would just let me script checking the box right?  So like you said later I would need to build in the if/else logic to determine if the box is checked in the original field, but that's what I'm having trouble with, so far I haven't been able to find a way to evaluate the checked/unchecked status of a box.

0 0
replied on April 25, 2019

Hi Dennis,

The following should work, you'll just need to update the id references (ie, change "Field13" and "Field14" to whatever the relevant values are for your groups of checkboxes).

(function() {  
  function checkbox2Auto () {
    $('#q13 input').change(function() {
      $(this).each(function() {
        var id = $(this).prop('id');
        var target = id.replace('Field13', 'Field14');
        if (this.checked) {
          $('input[id="' + target + '"]').prop('checked', true);
        }
        else if (!this.checked) {
          $('input[id="' + target + '"]').prop('checked', false);
        }
      });
    });
  }
                                 
  $(document).ready(function() {
      checkbox2Auto();
  });
})();

Best,

Rob

1 0

Replies

replied on April 25, 2019

Between Rob's reply and Sheila's response to this thread: (https://answers.laserfiche.com/questions/102370/File-upload-override-JS-and-enables-submit-button#102580) I was able to cobble together what I needed.  One of the changes I had to make was to use '#q597 input' to specify the field input I wanted to use as a source, as well as the destination field.  Since I'm copying from two different sources (one an English version of the field and one a Spanish version of the field) into a single source, I wrote two versions of this, one that goes into effect if English is selected, one that goes into effect if Spanish is selected.

Here's the final script for this part that includes logic for when to check and uncheck the destination box:
 

//Ethnicity
$('#q597').change(function() {
  var check1 = $('#q597 input[type=Checkbox][value=Hispanic_Latino]').is(':checked');
  var check2 = $('#q597 input[type=Checkbox][value=American_Indian_Alaskan_Native]').is(':checked');
  var check3 = $('#q597 input[type=Checkbox][value=Asian]').is(':checked');
  var check4 = $('#q597 input[type=Checkbox][value=Black_African_American]').is(':checked');
  var check5 = $('#q597 input[type=Checkbox][value=Hawaiian_Pacific_Islander]').is(':checked');
  var check6 = $('#q597 input[type=Checkbox][value=White]').is(':checked');

     if (check1) {
      $('#q668 input[type=Checkbox][value=Hispanic_Latino]').prop("checked", true);
     } else {
      $('#q668 input[type=Checkbox][value=Hispanic_Latino]').prop("checked", false);
     }
    if(check2) {
      $('#q668 input[type=Checkbox][value=American_Indian_Alaskan_Native]').prop('checked', true);
     } else {
      $('#q668 input[type=Checkbox][value=American_Indian_Alaskan_Native]').prop("checked", false);
     }
     if(check3) {
       $('#q668 input[type=Checkbox][value=Asian]').prop('checked', true);
     } else {
      $('#q668 input[type=Checkbox][value=Asian]').prop("checked", false);
     }
     if(check4) {
      $('#q668 input[type=Checkbox][value=Black_African_American]').prop('checked', true);
     } else {
      $('#q668 input[type=Checkbox][value=Black_African_American]').prop("checked", false);
     }
     if(check5) {
      $('#q668 input[type=Checkbox][value=Hawaiian_Pacific_Islander]').prop('checked', true);
     } else {
      $('#q668 input[type=Checkbox][value=Hawaiian_Pacific_Islander]').prop("checked", false);
     }
     if(check6) {
      $('#q668 input[type=Checkbox][value=White]').prop('checked', true);
     } else {
      $('#q668 input[type=Checkbox][value=White]').prop("checked", false);
     }
});

 

1 0
replied on April 25, 2019

Hi Dennis,

I just had the opportunity to get back to this. I see you figured out a solution, that's awesome! I found one too, and it might be easier to maintain if you add checkboxes in the future.

Best,

Rob

0 0
replied on April 25, 2019

What was the solution you found?

0 0
replied on April 25, 2019

Posted below--it assumes that both sets' checkboxes are in the same order, but it listens for a change to the first set, then checks the same box in the next set. It's fairly generic, so you should be able to add more checkboxes in the future without having to update the code.

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

Sign in to reply to this post.