Question

Copy a table 1 to table 2 in the same form

Forms

Updated March 20, 2018

asked on March 18, 2018 • Show version history

Hello,
I was able to ultilize the code in this topic

https://answers.laserfiche.com/questions/108241/How-to-Copy-Values-in-Table-1-to-Table-2-in-Same-Form#108275

to copy values from table 1 to table 2 in the same form. However, I noticed that when i delete the row from table 1, the same row in table 2 didn't get deleted even though it should.

I also notice that the row delete (X) is gone from the original table. I had to force

.cf-table-delete {display:inline!important}

to make it show up.

I think i might be missing something. What can i do to get rows in table 2 deleted when the matching rows in table 1 deleted? Any helps are really appreciated.

Thank you

0 0

Replies

replied on March 18, 2018

Hi Tuan,

Did you have special setting on the table fields? I tested the code and the delete buttons could show properly, and it could delete rows from table 2 when I click the CopyTable button.

0 0

replied on March 18, 2018

thank you for your answer. I am very sorry to mention that I modified the code to trigger the add or delete on table change event.

// test
   //copy table
  $('.Tabletest1 ').on('change',function(){
    //Make the tables the same size
    var sLen1 = $('.Tabletest1  tbody tr').length;
    var dLen1 = $('.tabletest2  tbody tr').length;
    if (sLen1 > dLen1){
      for(var j=0; j< sLen1-dLen1; j++){
        $('.tabletest2  .cf-table-add-row').click();
      }
    } else if (dLen1 > sLen1){
      for(var j=0; j< dLen1-sLen1; j++){
        
        $('.tabletest2  tbody tr:last-child .cf-table-delete').click();
      }
    }
    //Copy the data
    $('.Tabletest1  tbody tr').each(function(){
      var i = $(this).index();
      $(this).find('td').each(function(){
        var title = $(this).attr('data-title');
        //Check if this is a Radio button or Checkbox item, handle it accordingly
        if ($(this).find('span.choice').length >0){
          $(this).find('span.choice').each(function(){
            var eIndex = $(this).index();
            $('.tabletest2  tbody tr:nth-child('+(i+1).toString()+') td[data-title="'+title+'"] div span:nth-child('+(eIndex+1).toString()+') input').prop('checked',$(this).find('input').is(':checked'));
          });
        } else {
          //Otherwise, just copy the one input/select element
          $('.tabletest2   tbody tr:nth-child('+(i+1).toString()+') td[data-title="'+title+'"] [id^="Field"]').val($(this).find('[id^="Field"]').val());
      			

        }
       
      });
       
    });
   
  });

My code is attached. I can trigger the table 2 add row when i click on add row on table 1 but when i delete the row on table 1 the delete on table 2 did not trigger.

0 0

replied on March 19, 2018 • Show version history

The "change" event was not triggered when you click the delete button.

You need to register the update function to on-clicking the delete button:

$('.SourceTable').on('click', '.cf-table-delete', function(){...});

0 0

replied on March 20, 2018

Thank you so much for your help. I got it working.

0 0

You are not allowed to follow up in this post.

Question

Question

Copy a table 1 to table 2 in the same form

Replies

Sign in to reply to this post.