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

Question

Question

Validate a field based on other entered Fields

asked on June 22, 2017

Hi Team,

 

Hope I can get a How to on this if possible? 

 

We have a Form that is used for Timesheets. At the moment based on "Hours In" and "Hours Out" per Table line, we are using JavaScript to Calculate the "Total Hours"

 

What I would like to do now is:

Based on the "Total", I want the end user to specify if the hours worked were either "Base Hours" Or/and "Sick Leave Taken" Or/and "Annual Leave Taken"

The total of the Three inputs requires to equal "Total Hours" calculated earlier from Javascript.

 

I have been trying to find a resolution for this but have hit a stumbling block, and was wondering if anyone has seen this / done this before? 

 

Thank you in advance

 

Regards

Ziad

0 0

Answer

SELECTED ANSWER
replied on June 25, 2017 Show version history

Have never seen this before so I wrote a demo (for Forms 10.2 and above).

Add CSS class "sumtototal" to the 3 fields and add "total" to the total field.

$(document).ready(function(){
  register();
  $('.cf-table-add-row').click(register);
  window.Parsley.addValidator('sumtototal', {
    validateNumber: function(value, requirement) {
      var elm = arguments[2].$element;
      return elm.attr('sum-validated') == 'true';
    },
    messages: {
      en: 'Sum not equal to total',
    }
  });
  function register()
  {
    $('.sumtototal input, .total input').change(function(){
      checkSum($(this));
    });
    $('.sumtototal input').attr('data-parsley-sumtototal', '');
  }
  function checkSum(elm)
  {
    var total = parseInt(elm.closest('tr').find('.total input').val());
    var sum = 0;
    var elms = elm.closest('tr').find('.sumtototal input');
    elms.each(function(){
      sum += parseInt($(this).val() || 0); //empty field treated as 0
    });
    elms.each(function(){
      if (total == sum) {
        $(this).attr('sum-validated', 'true');
      } else {
        $(this).attr('sum-validated', 'false');
      }
      $(this).parsley().validate();
    });
  }
})

 

0 0
replied on November 12, 2017

Hi Rui, 

 

We have been testing this but seem to be getting some validation error in this, not sure if this can be looked into? 

 

If the user has worked 0.75 hours and you enter in 0.25 in one of the fields, and enter 0.0 in the others, it does not advise you that it is incorrect? and the validation is ok? 

As per below: 

 

But, if i am to then change the numbers and add another 0.25 it is still accepting it as valid? 

 

Only if i go over the value, it advises that it is incorrect, but not when it is under the value? 

 

Please advise? as it looks like it only happens for calculations less than 1? 

 

Thank you

Ziad

 

1 0
replied on November 12, 2017

Hi Ziad,

I used parseInt function in the original script so it would ignore value less than 1.

Can you change all the parseInt to parseFloat and see if it works as expected?

1 0
replied on November 13, 2017

Hi Rui, 

 

That worked perfectly, thank you so much for the prompt response as well, 

 

Regards

Ziad

0 0

Replies

replied on April 2, 2020

How would I make this to include more fields?

replied on April 2, 2020

How would I modify the code above to include more than 3 fields?

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

Sign in to reply to this post.