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

Question

Question

Display Table rows based on Collection Field values

asked on December 23, 2019 Show version history

I have a Collection where the user can add 1 to 6 "Stops". There are 6 standard destinations to select from. 

 

 

Based on the number of "Stops", a tab (Leg 1, Leg 2, etc.) is shown for the user to enter additional information.

I would like to display only those destination rows in corresponding tables. This table is currently static and displays all 6 rows.

 

0 0

Answer

SELECTED ANSWER
replied on January 3, 2020

Something like this

$(document).ready(function () {

 $('.cf-table tr').hide(); 
  
    $('.cf-collection-block').on('change', '.stop select', showrows);
    function showrows() {
          
            
          $(this).each(function () {
            
        $('#q42').find('.cf-table-add-row').click();
         var stop = $(this).val();
 
        var add = $('#q42').find('tr:last').find('.leg select');
            add.val(stop);


         

 })
     }
});

 

1 0

Replies

replied on January 2, 2020

If you know the table is static, then you could show rows based off position of the row you want to show.  For example, jquery hides all the rows until the user adds a stop.  HIB row is static as the first row, so it is shown when HIB is selected and so forth.

 

$(document).ready(function () {

 $('.cf-table tr').hide(); 
  
    $('.cf-collection-block').on('change', '.stop select', showrows);
    function showrows() {
          
            
          $(this).each(function () {
            

            if($(this).val() == "HIB"){
             $(".cf-table tr:first-child").show(); 
            }
            
            if($(this).val() == "SRF"){
              $(".cf-table tr:nth-child(4)").show();             
          } 
            
         if($(this).val() == "TNV"){
              $(".cf-table tr:nth-child(6)").show();             
          } 
            
            if($(this).val() == "") {
              
           $('.cf-table tbody tr').hide(); 

          }

 })
     }
});

 

1 0
replied on January 3, 2020

This worked great, thanks.

 

What if the leg tables weren't static and I wanted the stops to display in the legs to in the order they were added. 

0 0
replied on January 3, 2020

As in you would want the rows to be automatically appended based off the number of stops?  What makes each row unique?  As in if HIB was selected, how would the row look different than if TRV was selected?

0 0
replied on January 3, 2020

The only difference in the 6 Rows would be the row label. The same data is required and totals calculated for each stop; Pax #, Pax WT, Baggage, Cargo and Total

0 0
replied on January 3, 2020

ahh, got it, yes then you could just autoappend the rows per stop, like this:

 

$(document).ready(function () {

 $('.cf-table tr').hide(); 
  
    $('.cf-collection-block').on('change', '.stop select', showrows);
    function showrows() {
          
            
          $(this).each(function () {
            
         $('#q42').find('.cf-table-add-row').click();

 })
     }
});
 

 

#q42 would be the name or variable of the table

 

0 0
replied on January 3, 2020

rather than having to mess around with row labels, I would add a dropdown to your rows with the same variables as the stops and autoassign the row to that stop based off what they select

0 0
SELECTED ANSWER
replied on January 3, 2020

Something like this

$(document).ready(function () {

 $('.cf-table tr').hide(); 
  
    $('.cf-collection-block').on('change', '.stop select', showrows);
    function showrows() {
          
            
          $(this).each(function () {
            
        $('#q42').find('.cf-table-add-row').click();
         var stop = $(this).val();
 
        var add = $('#q42').find('tr:last').find('.leg select');
            add.val(stop);


         

 })
     }
});

 

1 0
replied on January 3, 2020

Awesome! Thank you, Rose

0 0
replied on January 7, 2020

One thing I have noticed is that if I select HIB as Stop 1, a Leg row is added. If I then change Route HIB to SRF, a second Leg row is added instead of updating the first row. See below images.

 

 

 

 

 

0 0
replied on December 23, 2019

I don't believe you can do that through the basic forms functionality.  I am sure you could use javascript but is the table you list on the same form as the collection or is there a step in between.  If there is, you could write the values they select to SQL and then populate the table based on a lookup rule.  Again, that only works if there is a submit in between though.

0 0
replied on December 23, 2019

The collection and tables are on the same form.

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

Sign in to reply to this post.