Question

Manipulating only the current Table Row with Jquery

Forms

Updated October 25, 2017

asked on October 23, 2017 • Show version history

We are writing a form for finance, in the form there are two tables

What we want to happen, is that if the user selects Breakfast, then ONLY the Cost Per Day BESIDE the Reason on THAT particular row is changed to match the breakfast numerical value from the Table above it.(As roughly shown in the demo above, except it needs to happen automatically).

(Both Tables in Preview Mode with Class Name). Right now the way I am handling it is, if it detects a change on tblReason, then it loops through ALL remCostPerDay and if it detects a "0.00 value", it changes it, see code below. And this method works, and it's functional, but there are limitations too it(Such as when the user changes their mind). We want it that to when it's changed, the remCostPerDay beside tblReason happens on each row and doesn't affect all other rows tied to that class.

$('.cf-table-block').on('change','.tblReason select', function() {
  var reason = $(this).val();
  var breakfast = $('.mieBreakfast input').val();
  var lunch = $('.mieLunch input').val();
  var dinner = $('.mieDinner input').val();
  
  if(reason == "Breakfast"){
    $(".remCostPerDay input").each(function(){
      if($(this).val() == "0.00"){
      	$(this).val(breakfast);
      }
    });
   }
  
  if(reason == "Lunch"){
    $(".remCostPerDay input").each(function(){
      if($(this).val() == "0.00"){
      	$(this).val(lunch);
      }
    });
   }
  
  if(reason == "Dinner"){
    $(".remCostPerDay input").each(function(){
      if($(this).val() == "0.00"){
      	$(this).val(dinner);
      }
    });
   }
  
 });

Any help on this would be greatly appreciated(Also note we did try this using Laserfiche Functions first, but due to a few issues we backed away from Functions and went with Javascript / Jquery).

0 0

Answer

SELECTED ANSWER

replied on October 24, 2017 • Show version history

One approach would be to nest the if statements within one another like so,

=IF(condition1,value1,IF(condition2,value2,IF(condition3,value3,default)))

but it looks like you already tried that, so

Alternatively, you could use separate IF for each one, default them to 0, and add them together like so,

=IF(option="A",1,0)+IF(option="B",2,0)+IF(option="C",3,0)

OR, you could default them to an empty string and concatenate the results like this (a little bit iffy since it will treat it like a string),

=CONCATENATE(IF(option="A",1,""),IF(option="B",2,""),IF(option="C",3,""))

I've tested all three of these options and they work as intended, so it is really a matter of personal preference.

I'd say the second "adding" option is the easiest to maintain because you'll only ever have one "True" condition, the math should always work out the way you want, it is the "cleanest" looking, and it's dealing with 100% numeric values.

For example,

No selection: 0 + 0 + 0 = 0

Option 1: 1 + 0 + 0 = 1

Option 2: 0 + 2 + 0 = 2

Option 3: 0 + 0 + 3 = 3

1 0

Replies

replied on October 24, 2017

If you don't mind me asking, what caused you to back away from using the Functions? Based on what you're describing it should be possible to get them working.

There are ways to use JavaScript to target a specific row, and if you examine the Field IDs you'll see that they have an additional number next to them indicating the Row.

For example Field1, Field2, and Field3 in a table would be like this:

#Field1(1) #Field2(1) #Field3(1)

#Field1(2) #Field2(2) #Field3(2)

#Field1(3) #Field2(3) #Field3(3)

So, in theory, you could do a few things. Find the common parent of the changed field first, then select only that parent's children, iterate through the rows based on the number - 1 to get the index, or just target the fields by ID and use the same number extracted from the changed field.

1 0

replied on October 24, 2017 • Show version history

After seeing this and using Chrome Console, we were able to also come up with a Javascript/JQuery solution(In case anyone ever hits this roadblock and needs a JQuery alternative). Even though the equation way, in our opinion, is the better way to handle it and that is the method we went with. Here is the JQuery/Javascript below.

$('.cf-table-block').on('change','.tblReason select', function() {
  var reason = $(this).val();
  var breakfast = $('.mieBreakfast input').val();
  var lunch = $('.mieLunch input').val();
  var dinner = $('.mieDinner input').val();
  var reasonID = $(this).attr('id');
  reasonID = reasonID.replace("Field72", "Field42");
  document.getElementById(reasonID).value = "0.00";
  
  if(reason == "Breakfast"){
      document.getElementById(reasonID).value = breakfast;
   }
  
  if(reason == "Lunch"){
      document.getElementById(reasonID).value = lunch;
   }
  
  if(reason == "Dinner"){
      document.getElementById(reasonID).value = dinner;
   }
  
});

Basically all we do in this code is grab the attribute ID of reason on a variable called reasonID, then we replace the Field72 with Field42(the ID of the Cost Per Day Row), then we use Javascript and set the value of reasonID to the variable we want(the class value from the first table). This way, on the switch, Field42(index) will always mirror Field72(index)

1 0

replied on October 24, 2017

No problem on the asking.

The main thing that drove us away from using the Functions was this,

=IF(INDEX(v_Business_Purpose_Table.v_Business_Purpose_Reason,ROW()) = "Breakfast", v_Expenses_Breakdown_By_Zip_Code.v_MIE_Breakfast,IF(INDEX(v_Business_Purpose_Table.v_Business_Purpose_Reason,ROW()) = "Lunch", v_Expenses_Breakdown_By_Zip_Code.v_MIE_Lunch,IF(INDEX(v_Business_Purpose_Table.v_Business_Purpose_Reason,ROW()) = "Dinner", v_Expenses_Breakdown_By_Zip_Code.v_MIE_Dinner,0)))

And this absolutely worked great, but the problem is there was more options than Just Breakfast, Lunch, Or Dinner(Such as Ground Transportation), so if the user selected Ground Transportation, then it defaulted to 0. Apparently OpenFormula can't evaluate an IF statement WITHOUT doing an ELSE.(From everything we read and tried anyway, but we are definitely open to solutions

1 0

SELECTED ANSWER

replied on October 24, 2017 • Show version history

One approach would be to nest the if statements within one another like so,

=IF(condition1,value1,IF(condition2,value2,IF(condition3,value3,default)))

but it looks like you already tried that, so

Alternatively, you could use separate IF for each one, default them to 0, and add them together like so,

=IF(option="A",1,0)+IF(option="B",2,0)+IF(option="C",3,0)

OR, you could default them to an empty string and concatenate the results like this (a little bit iffy since it will treat it like a string),

=CONCATENATE(IF(option="A",1,""),IF(option="B",2,""),IF(option="C",3,""))

I've tested all three of these options and they work as intended, so it is really a matter of personal preference.

For example,

No selection: 0 + 0 + 0 = 0

Option 1: 1 + 0 + 0 = 1

Option 2: 0 + 2 + 0 = 2

Option 3: 0 + 0 + 3 = 3

1 0

replied on October 24, 2017

Perfect! That was what we are going for.

1 0

You are not allowed to follow up in this post.

Question

Question

Manipulating only the current Table Row with Jquery

Answer

Replies

Sign in to reply to this post.