Pass through a variable from an answer to a hidden form field

Hi folks,
I’m running against walls here, maybe you have an idea for a workaround:

I’m building a multi-page qualitative network survey with Knack where you first fill in your institutional information (which goes in one Knack table) and then, on the next page, you fill in a form that is saved to a different Knack table, stating a cooperation with another institution. This form can be reloaded multiple times in case you want to state that you are part of many different cooperations.

For obvious reasons, this Knack table with all the cooperation information has, inter alia, two fields: Information about the institution filling out the form, and information about the name of the cooperation partner. For the first of these two fields I’d like to pass through the information from the first part of the survey (e.g. either the name of the institution that the interviewee has given beforehand, or the ID that has been created by Knack on form submission). Is there a way to pass this information, via session, URL or whatsoever and paste this into a hidden field (or pre-populating an input)?
(And I’m sorry but I do not want to use accounts and user rights for interviewees to keep the survey accessible.)

Any help is greatly appreciated. :pray:

Hi @Stephan,

Welcome to the Knack community! :slight_smile:

A support article that may be of use to you while you’re trying to accomplish this goal is How to Create a Multi-Part Form. One of the use cases for this workflow is for building out surveys.

If you find that this will not enable you to do what you would like to, please don’t hesitate to reach out to our support team for assistance. You can do so by submitting this form here. They’ll be happy to take a look at your current app setup and provide helpful tips on how to build out your workflow.

Thank you for sharing your question!

Thank you for getting back, Les,
The multi-part form is working well so far. The issue I’m facing is that the answers to this multi-page form are wandering in two different tables, and that I want to use an input that has been saved in Table 1 during Page 1 of the form in a hidden field on Page 2 of the form so that the same input will be saved in Table 2. Literally passing through an input from a former input.
I wondered if anyone else from the community has run into this challenge. Maybe one can use JavaScript to accomplish this if Knack doesn’t offer such an option…

Hi @Stephan

We have done this before. We let Knack do some of the work:

If the objects are connected you can pull into the second form a details view with the fields you wish to bring forward. You can hide this view in the CSS:

#view_xyz {
    display: none;
}

You can then use some code to get the value of the details field and insert it into the relevant input:

$(document).on('knack-scene-render.scene_yyy', function (event, scene){
     const field1 = $('#view_123 .field_123 .kn-detail-body').text().trim(); // Get value 1 from the details view
     const field2 = $('#view_123 .field_456 .kn-detail-body').text().trim(); // Get value 2 from the details view
     $('#field_xyz').val(field1) // This will insert value 1 into the first form field 
     $('#field_abc').val(field2)
}):

You can then make the inputs hidden in the CSS:

#view_ 123 #kn-input-field_123, #view_123 #kn-input-field_456 {
visibility: hidden;
}

If you want to remove the extra space that making the fields hidden will leave (if you use display: none here the values will not be submitted) you can add margin-bottom: -70px to the input that is above the fields you wish to hide.

I hope this helps. If you need any further info or this isn’t quite what you are after, I’ll be more than happy to help.

Craig

Edit: you should use $(‘field_123’).val(field1) to enter values into fields not .text(field1)

1 Like

Hi Craig,
thank you for introducing me to Knack JavaScript objects - it’s a wrap!
I slightly edited your code and was able to pre-fill several invisible input fields (plus, I’ve put a console.log into the code to check whether the parsed values are correct). Here’s my code:

CSS:

#view_30 {
  display: none !important;
}
#view_2 #kn-input-field_57, #view_2 #kn-input-field_58, #view_2 #kn-input-field_17 {
  visibility: hidden;
  margin-bottom: -62px;
}

JavaScript:

$(document).on('knack-view-render.view_2', function (event, scene){
    const field1 = $('#view_30 .field_13 .kn-detail-body').text().trim();
    const field2 = $('#view_30 .field_3 .kn-detail-body').text().trim(); 
    const field3 = $('#view_30 .field_39 .kn-detail-body').text().trim(); 
    console.log('the selected values are ' + field1 + field2 + field3);
    $('input#field_17').attr('disabled', 'disabled');
    $('input#field_57').attr('disabled', 'disabled');
    $('input#field_58').attr('disabled', 'disabled');
    $('input#field_17').attr('value', field1);  
    $('input#field_57').attr('value', field2);
    $('input#field_58').attr('value', field3);
})

Thank you so much again for pointing me to the solution :vulcan_salute:

Best,
Stephan

Hi @Stephan

You can find a lot of help with JavaScript and Knack here:

https://docs.knack.com/

Craig