Validation or dependencies for next button

Hello @peti73

The “Next Page” button is not a form field. However, you can insert a “Single Line Text” field in the form, and configure it as follows:

– Tick the checkbox to make the field as required.
– Enter the code to check through its regular expression attribute. For example, if the code is ABC123, the regular expression would be: /^ABC123$/
– Enter the error message to display through the error message attribute.

Configuring the field like above, the user cannot move on the next page without entering the valid code.

Best regards.

Thanks!

Does it work with multiple codes? (Ie. ABC123 or ABC234 or ABC345)

Hello @peti73

Yes, you can create a regular expression to cover all these options:

/^ABC((123)|(234)|(345))$/

Best regards.

Thank You again!

Can i use a range too? (ie. from ABC100 to ABC200)

Another problem is that this cff-gotopage event is triggered when i press the next button even if the required field is wrong: cff-gotopage

Hello @peti73

You should create a regular expression more complex, like:

/^ABC((1[0-9]{2})|(200))$/

Into the cff-gotopage event you can check if the form is valid:

<script>jQuery(document).one('cff-gotopage', function(){
if(jQuery('[id*="cp_calculatedfieldsf_pform_"]').valid()){
/* Your code here */
}
});</script>

Best regards.

Unfortunately it doesn’t work.
Now the API-request isn’t made at all.

<script>
jQuery(document).one('cff-gotopage', function(){
if(jQuery('[id*="cp_calculatedfieldsf_pform_"]').valid()){

	fbuilderjQuery.getJSON( 'https://api.metalpriceapi.com/v1/latest?api_key=[API_KEY]&base=USD&currencies=EUR,XAU,XAG', 
    function(data){
        fbuilderjQuery('[id*="fieldname3_"]').val(1/data['rates']['XAU']);
        ENABLEEQUATIONS(jQuery('[id*="cp_calculatedfieldsf_pform_"]'));
        EVALEQUATIONS(jQuery('[id*="cp_calculatedfieldsf_pform_"]'));
    });
}
});
</script>

Thank You again!

Hello @peti73

If the API is not being called, the validation rules are failing.

If you want to call the API when the user reaches the second page in the form, you can edit the code as follows:

<script>
jQuery(document).one('cff-gotopage', function(evt, params){
if(jQuery('.pb1').is(':visible')){
	fbuilderjQuery.getJSON( 'https://api.metalpriceapi.com/v1/latest?api_key=[API_KEY]&base=USD&currencies=EUR,XAU,XAG', 
    function(data){
        fbuilderjQuery('[id*="fieldname3_"]').val(1/data['rates']['XAU']);
        ENABLEEQUATIONS(jQuery('[id*="cp_calculatedfieldsf_pform_"]'));
        EVALEQUATIONS(jQuery('[id*="cp_calculatedfieldsf_pform_"]'));
    });
}
});
</script>

Please, remember to replace [API_KEY] with your API key.

Best regards.

• This reply was modified 2 years, 9 months ago by Steven Stern (sterndata).

Hello,

almost perfect!
There’s one problem though: if I enter the wrong code the first time, then even if I continue with the correct code, the API request isn’t made and that price field remains empty.

Hello @peti73

You asked me for an alternative of calling the API only once. Furthermore, I don’t understand what you mean by “enter the wrong code the first time” because you are not passing additional parameters to the external API.

Best regards.

Hi,

on Page 1 there is only a required “Single Line Text” field with a regular expression like this:
/^ABC((1[0-9]{2})|(200))$/
which functions like an “entry code”.

On Page 2 there is the field with the API-request.

If i enter the wrong code on Page 1, obviously i can’t go to Page 2 with the “Next” button. But even after this i enter the correct code, and step to Page 2, the API isn’t called anymore.

Does it make sense?

Thank You again!

Hello @peti73

If you want to call the API every time the user varies the field’s value, assuming the field’s name is the fieldname123, you can use the piece of code:

<script>
jQuery(document).on('change', '[id*="fieldname123_"]', function(evt, params){
	fbuilderjQuery.getJSON( 'https://api.metalpriceapi.com/v1/latest?api_key=[API_KEY]&base=USD&currencies=EUR,XAU,XAG', 
    function(data){
        fbuilderjQuery('[id*="fieldname3_"]').val(1/data['rates']['XAU']);
        ENABLEEQUATIONS(jQuery('[id*="cp_calculatedfieldsf_pform_"]'));
        EVALEQUATIONS(jQuery('[id*="cp_calculatedfieldsf_pform_"]'));
    });
});
</script>

Best regards.

Hi,

You helped me free a lot, now i made a request for a customization service.

Best regards.