connecting forms

Hello,

The use of dependencies is not possible in this case, because the dependencies are applied only between fields in the same form, however, there are alternatives.

For example, you can assign class names to the fields in the first and second forms that must be unique in the webpage, for example: my-field-in-the-first-form, and my-field-in-the-second-form

and then in the second form insert a “HTML Content” field with a piece of code similar to the following one:

<script>
jQuery(document).on('change', '.my-field-in-the-first-form input', function(){
if(jQuery(this).val() == 'the value to compare')
{
jQuery('.my-field-in-the-second-form').show().find('input,textarea,select').removeClass('ignore');
}
else
{
jQuery('.my-field-in-the-second-form').hide().find('input,textarea,select').addClass('ignore');
}
});
</script>

Of course, you should adjust this solution to your project.

Best regards.

Hello again,

The above code doesn’t seem to be working properly for me.

<script>
jQuery(document).on('change', '.my-unit-dropdown', function(){
if(jQuery(this).val() == 'Metric')
{
jQuery('.my-auxiliary-kg-field').show().find('input,textarea,select').removeClass('ignore');
jQuery('.my-auxiliary-kg-field-goal').show().find('input,textarea,select').removeClass('ignore');
jQuery('.my-auxiliary-lbs-field').hide().find('input,textarea,select').addClass('ignore');
jQuery('.my-auxiliary-lbs-field-goal').hide().find('input,textarea,select').addClass('ignore');
}
else
{
jQuery('.my-auxiliary-lbs-field').show().find('input,textarea,select').removeClass('ignore');
jQuery('.my-auxiliary-lbs-field-goal').show().find('input,textarea,select').removeClass('ignore');
jQuery('.my-auxiliary-kg-field').hide().find('input,textarea,select').addClass('ignore');
jQuery('.my-auxiliary-kg-field-goal').hide().find('input,textarea,select').addClass('ignore');
}
});
</script>

I tried to display two kg fields and hide the lbs fields when the dropdown (present in form 1) value is metric and vice versa.

• This reply was modified 7 years, 9 months ago by Damn!.
• This reply was modified 7 years, 9 months ago by Damn!.

Hello again,

The above code works only when you change the value in the drop down field and that too not properly. What I mean is when the page loads and the default value of drop is metric the code doesn’t work and once you change the value to imperial, the code works and now once again when you change the dropdown value back to metric, it doesn’t bring back the respective kg fields.

thanks

Here’s the sample page with 2 forms present: https://damnripped.com/test/

• This reply was modified 7 years, 9 months ago by Damn!.
• This reply was modified 7 years, 9 months ago by Damn!.
• This reply was modified 7 years, 9 months ago by Damn!.

Hello, can this code work to retrieve data from a specific user who entered data into the first form?
thnx

Hello @greedymind,

You simply should trigger an onchange event before closing the script tag, and after the webpage is loaded:

....
jQuery(window).on('load', function(){
jQuery('.my-unit-dropdown input').change();
});
</script>

By the way, you are not defining the events correctly, you have defined the event for the ‘.my-unit-dropdown’ class, but the event should be applied to the input field whose parent has assigned the class: ‘.my-unit-dropdown’

Query(document).on('change', '.my-unit-dropdown input', function(){

Best regards.

Hello @mart08812,

I’ll respond to question in your other support thread.

Best regards.

I’m sorry, but still it doesn’t seem to be working.

<script>
jQuery(document).on('change', '.my-unit-dropdown input', function(){
if(jQuery(this).val() == 'Metric')
{
jQuery('.my-auxiliary-kg-field').show().find('input,textarea,select').removeClass('ignore');
jQuery('.my-auxiliary-kg-field-goal').show().find('input,textarea,select').removeClass('ignore');
jQuery('.my-auxiliary-lbs-field').hide().find('input,textarea,select').addClass('ignore');
jQuery('.my-auxiliary-lbs-field-goal').hide().find('input,textarea,select').addClass('ignore');
}
else
{
jQuery('.my-auxiliary-lbs-field').show().find('input,textarea,select').removeClass('ignore');
jQuery('.my-auxiliary-lbs-field-goal').show().find('input,textarea,select').removeClass('ignore');
jQuery('.my-auxiliary-kg-field').hide().find('input,textarea,select').addClass('ignore');
jQuery('.my-auxiliary-kg-field-goal').hide().find('input,textarea,select').addClass('ignore');
}
});
jQuery(window).on('load', function(){
jQuery('.my-unit-dropdown input').change();
});
</script>

thanks.

• This reply was modified 7 years, 9 months ago by Damn!.
• This reply was modified 7 years, 9 months ago by Damn!.

Hello,

My apologies, I had not identified that the field is DropDown, so, the tag is a “select” and not an “input”. The code would be:

<script>
jQuery(document).on('change', '.my-unit-dropdown select', function(){
if(jQuery(this).val() == 'Metric')
{
jQuery('.my-auxiliary-kg-field').show().find('input,textarea,select').removeClass('ignore');
jQuery('.my-auxiliary-kg-field-goal').show().find('input,textarea,select').removeClass('ignore');
jQuery('.my-auxiliary-lbs-field').hide().find('input,textarea,select').addClass('ignore');
jQuery('.my-auxiliary-lbs-field-goal').hide().find('input,textarea,select').addClass('ignore');
}
else
{
jQuery('.my-auxiliary-lbs-field').show().find('input,textarea,select').removeClass('ignore');
jQuery('.my-auxiliary-lbs-field-goal').show().find('input,textarea,select').removeClass('ignore');
jQuery('.my-auxiliary-kg-field').hide().find('input,textarea,select').addClass('ignore');
jQuery('.my-auxiliary-kg-field-goal').hide().find('input,textarea,select').addClass('ignore');
}
});
jQuery(window).on('load', function(){
jQuery('.my-unit-dropdown select').change();
});
</script>

Best regards.

thanks a lot. it works now