Using jotform to control file DOWNLOAD from SquareSpace site

  • Profile Image
    lrogers_ariaconsulting
    Asked on May 06, 2019 at 10:15 PM

    Hi all,

    Not sure if anyone will be able to provide insight on this, but going ahead and asking anyway!

    First, I'm new to jotform so please forgive any dumb aspect(s) of my question.

    So, I've just had my company website completely redeveloped on SquareSpace.  One of the pages I want to use to have a bunch of files that visitors can view online (but obviously can't copy any content from or anything like that) and be able to download them.  However, before they can download, I want to use a jotform to capture the minimal info for some lead generation follow up.

    Hence, I want to be able to present the visitor with a "download" button that allows them to actually download the file once they have filled out the Squarespace form.  The files are stored on SquareSpace, though that isn't 'required' as I can also store the files in any of:

    - OneDrive (consumer or OneDrive for Business)

    - Azure blob storage

    - Zoho.com documents

    - Dropbox (though I prefer OneDrive)

     

  • Profile Image
    Mike_G
    Answered on May 06, 2019 at 11:46 PM

    You can set up the form to redirect to a different page and have that page serve as your form's Thank-You page.

    Redirecting-Users-to-a-Different-Page

    On the page where your form will be redirected to when your respondents successfully submit your form can have the download button that you require.

    https://stackoverflow.com/questions/2906582/how-to-create-an-html-button-that-acts-like-a-link/2906611

    The button will act as a link that when clicked it will open the page where the file(s) can be downloaded. However, if you want to have the file to automatically download as soon as the button is clicked, I suggest that you contact your chosen file storage and ask if there's a way to produce such link.

  • Profile Image
    lrogers_ariaconsulting
    Answered on May 07, 2019 at 10:11 AM

    Hi Mike,

    Thanks very much for the reply!  I've sent the reply, verbatim, to my developer to see what he thinks.

  • Profile Image
    lrogers_ariaconsulting
    Answered on May 08, 2019 at 10:50 AM

    My developer is telling me that I would have to create a new jotform for every file I want to use this for?  Is there a way around that??

    Consider this a cry for help!

  • Profile Image
    Nik_C
    Answered on May 08, 2019 at 12:58 PM

    Well, that depends on how the files should show for download?

    How that files would change, on what criteria?

    If it is always the same file, you can then use one form and one thank you page (as advised by my colleague).

    If it is not, then we need the above information to review the possibilities.

    Thank you.

  • Profile Image
    lrogers_ariaconsulting
    Answered on May 08, 2019 at 05:48 PM

    Hi Nik,

    Thanks for the reply! There will ultimately be many files and any visitor could choose any file.  So, each file obviously has a different URI.  Whether I store them in SQS or in Zoho or in Azure doesn't really matter.  It seems like that is where the problem is: how to be able to synchronously serve the content back to the visitor through the browser so they can choose to download it.  Or view with the appropriate application like Office of PDF reader, etc.

  • Profile Image
    jonathan
    Answered on May 08, 2019 at 07:33 PM

    You can use the Conditions tool to create a different Thank You URL redirect page to redirect the respondent to the specific file they want to download.

    Please review the user guide: Change Thank You Page URL Based on a Condition

    1. Ask a question on your form that will give the hint as to which file or URL the respondent will be redirected.

    2. Then you can create the redirect condition rule base on that question field to redirect the respondent to the URL on form submission.

    Example:


    You can only use one form, and create different/multiple redirect conditions.

    Let us know if you need further assistance.


  • Profile Image
    lrogers_ariaconsulting
    Answered on May 08, 2019 at 07:48 PM

    Unfortunately, people being what they are, there is a VERY low chance that people will do that extra step.  Which means I lose them at that crucial point.  I can specify a "source link" for each file on the page whether that is within SQS itself or just an HTML link to the file stored outside SQS.  Is there a way to set a variable on the form to pick up the URI of the file they clicked on and pass that to the 2nd/thank you page in such a way that the correct file would be invoked from the URI and be able to be downloaded synchronously?

  • Profile Image
    Jed_C
    Answered on May 09, 2019 at 12:03 AM

    1). There is a VERY low chance that people will do that extra step. — You mean the extra question before they get redirected to download link? You can always set the field as required so it will be mandatory for them. The whole process won't be completed unless they answer the question as the condition to redirect URL will be basing on that question.

    2). Is there a way to set a variable on the form to pick up the URI of the file — Where would the file be? You can pass value in Jotform and there are several ways to do it. I'm just not sure where to pull the file name.

    Please refer to the links below for more information:

    https://www.jotform.com/help/71-Prepopulating-Fields-to-Your-JotForm-via-URL-Parameters

    Please note that you can put the field's "Unique Name" in your thank you page condition.

    ex.

    1557374508The Easiest Online Form Builde

    In my screenshot, the {typeA} unique name is from a short text entry field. That field is automatically filled with a URL if certain condition is met.

    Sample screencast:

    1557374862condition_ty_page.gif

    Is that what you want? Looking forward for your response. 

  • Profile Image
    lrogers_ariaconsulting
    Answered on May 09, 2019 at 09:58 PM

    My preference would be to store the actual files in Azure blob storage.  Easy to access via a straight HTTP call (or an HTTP GET).  And I get all the security and performance of Azure.  And i can store a LOT of files before the cost starts to become any sort of concern.

    But if I make that field mandatory, it WILL drive a percentage of people away.  That's why I'm trying to see if there is a way to do it with the visitor JUST clicking the initial 'download' button on the page that would invoke the form and them clicking 'submit' in the form.

  • Profile Image
    Nik_C
    Answered on May 10, 2019 at 02:23 AM

    So, if I understood properly, you want your users to fill the form and when submit, they will see the files which they can download, they choose which one they want to download right?

    If that's the case, Maybe you could use Azure's explorer to show the files (or access the link directly): https://docs.microsoft.com/en-us/azure/storage/blobs/storage-quickstart-blobs-storage-explorer

    I'm not sure if Azure can expose whole explorer as some sort of page, but that might work.

    Or, if the user should be provided with a single file(s), a link could be constructed for him and placed in Thank you page.

    For example:

    1557469327Screen Shot 2019-05-10 at 8.22

    If the files are created in the same manner (just different file name for example), that could be constructed in the form, but I'm not sure what is the logic you want to create that will define such link?

  • Profile Image
    lrogers_ariaconsulting
    Answered on May 10, 2019 at 01:09 PM

    Let me try to explain again, but with a visual aid ;)

    Here is the page with the files currently.  These are just a few of what I need to put up, but they are there for testing at the moment.  Right now, the files are stored directly on SQS with a link as well that enables the download capability.  However, there is no form attached to that download button at the moment.

    1557507952Annotation 2019-05-10 110144.p

    What I want is for a visitor to be able to click on the download button, a single jotform comes up and the form already knows which file the visitor clicked on the download link button for, and when they click 'submit' in the jotform (again a SINGLE FORM FOR ALL THE FILES), they immediately get presented with the standard open/download dialog for whatever OS they're on.

    That's what I want.  Not sending them to a page where they have to go and find the file again.  Just click, fill the fields, click again to submit the form, and file is available to them.

  • Profile Image
    lrogers_ariaconsulting
    Answered on May 10, 2019 at 01:13 PM

    Oh, and just to reiterate, storing the files can be done in Azure blob, OneDrive (consumer or OneDrive for Business), directly in SQS, Zoho documents, or Dropbox (in pretty much that order of preference).

  • Profile Image
    Nik_C
    Answered on May 10, 2019 at 02:19 PM

    Thank you, I'll check this and get back to you.


  • Profile Image
    lrogers_ariaconsulting
    Answered on May 10, 2019 at 02:55 PM

    Thanks very much!

  • Profile Image
    lrogers_ariaconsulting
    Answered on May 11, 2019 at 02:15 PM

    Any update?

    Thanks!

  • Profile Image
    lrogers_ariaconsulting
    Answered on May 12, 2019 at 02:38 PM

    Hi,

    Is there an update on this?

    Thank you!


  • Profile Image
    Nik_C
    Answered on May 13, 2019 at 02:26 AM

    I'm sorry for the delay.

    I checked this but I'm afraid that I wasn't able to find a solution that would work for you.

    What I want is for a visitor to be able to click on the download button, a single jotform comes up and the form already knows which file the visitor clicked on the download link button for,

    This part can only be done with prepopulate link: https://www.jotform.com/help/71-Prepopulating-Fields-to-Your-JotForm-via-URL-Parameters

    That, when you click the button you would navigate the user to your jotform form URL with prepopulate parameter that would fill one field (it can be hidden) in the form, and which value you could use later.

    and when they click 'submit' in the jotform (again a SINGLE FORM FOR ALL THE FILES), they immediately get presented with the standard open/download dialog for whatever OS they're on.

    This part I'm not sure if it could be done. That you can open trigger downloading immediately after submitting.

    Unless Azure would trigger downloading via Browser when accessing a link directly.

    If that works, then it might be able to construct such link in the form and redirect user to proper link with each submit (so the download will trigger on submit).

    If you could please check some of the links you have, and access them directly via URL and see how they work.

    If it works that way, please share some of the links here so we could try to create such logic.

    Thank you.

  • Profile Image
    lrogers_ariaconsulting
    Answered on May 13, 2019 at 10:44 AM

    Hi Nik,

    Thanks for the reply.  Using Azure as the storage environment for the files, a direct URL for the file does invoke the standard open/save dialog from the operating system.  Here is a test file: https://ariawebfiles.blob.core.windows.net/webfiles/Test.docx


  • Profile Image
    denis_calin
    Answered on May 13, 2019 at 12:45 PM

    Hi @Irogers_ariaconsulting!

    You can redirect the user to various direct download links after the user clicks Submit by using the Change "Thank You" Page condition. I have created a sample form for you with the test file download link you have provided.

    Form: https://form.jotform.com/91324503600949

    Please clone the form to see how the Thank You page redirects to the download link you have provided.

    Guide: How-to-Clone-an-Existing-Form-from-a-URL

    The hidden Selected file field can be pre-populated with the name of the file that the user clicked the Download button for, and then used to set up the Change "Thank You" Page condition to redirect to various download links. Please refer to this guide for pre-populating fields.

    Guide: Prepopulating-Fields-to-Your-JotForm-via-URL-Parameters

  • Profile Image
    lrogers_ariaconsulting
    Answered on May 13, 2019 at 06:59 PM

    Hi Denis,

    That is certainly the behaviour I want from the form!

    So, you're saying that all I need to do is add that hidden field and set the unique name under field details to "selectedFile" and set the Field ID's to "#Input_5" and point the button on the SQS page to the URL of the form then it should all work?  And I only need the one form for all of the various files?

  • Profile Image
    lrogers_ariaconsulting
    Answered on May 13, 2019 at 07:32 PM

    No, apparently it is NOT that easy.  I would have to populate the thank you page redirect using the parameters passing method described in your last link.  EXCEPT:

    1) in my entire form, including the new hidden text field, there is NO input classes AT ALL.

    2) I would still have to create a separate form for EVERY SINGLE DOWNLOAD FILE because I have to hard code the URL of the file to be downloaded from Azure.

    Hence, this doesn't help me at all.

  • Profile Image
    Jed_C
    Answered on May 13, 2019 at 09:55 PM

    I don't think you can modify the "Download" link in your sample screenshot below.

    The way I understand it is on that "Resources" page:

    1). Your users will click the Download button

    2). A Jotform will automatically launches

    3). Jotform will capture the download link of the file and adds to thank you page redirection.

    4). Once user submits Jotform, they will automatically get the downloaded file.

    You can only do that process if you are able to modify the download link in your sample screenshot above.

    The process was already mentioned by my colleague:

    1). https://www.jotform.com/help/71-Prepopulating-Fields-to-Your-JotForm-via-URL-Parameters 

    2). Redirect thank you page https://www.jotform.com/help/38-Redirecting-Users-to-a-Different-Page

    Note: If you are not able to modify the button and customize it on your own, then the process won't work.

    Let us know if you have any questions or if you need further assistance. 

  • Profile Image
    lrogers_ariaconsulting
    Answered on May 13, 2019 at 10:07 PM

    I can modify the button fine.  The issue is that there doesn't seem to be ANY way of having the target URL in the thank you page of Jotform to be a pure variable in order to have a SINGLE form that can be used across multiple files.  That redirect for the thank you page article DOES NOT WORK in that scenario.  The article does not represent the reality of the form.  Again, there is NO input classes AT ALL in the source for the form.  Ergo, the article is NOT useful.

    Don't know how else to say that so it gets across.

  • Profile Image
    Kevin_G
    Answered on May 14, 2019 at 12:17 AM

    I think the workaround for your question posted on the thread below would work: 

    https://www.jotform.com/answers/1816828#1817604 

    Basically, the idea is: 

    1. You pre-populate the hidden field with the file URL to download. 

    2. You set the hidden field as custom thank you page. 

    To pre-fill the hidden field with the file URL you will need to edit every single download button on the page where your files are hosted on, this way you can change the hyperlink to the Jotform URL with the file's link passed through the form URL: 

    15578071291557507952Annotation 2019-05-1

    I have checked this form on your account http://www.jotform.ca/form/91238779847274 and basically what you need to do is the following: 

    - Get the hidden field unique name: 

    1557807234screenshot_01.png

    2. Set the field's name as custom thank you page: 

    1557807263screenshot_02.png

    The form will then capture the URL in the hidden field and this will be used as thank you page so the file should download automatically. 

    Here's an example about how you can prefill the form: http://www.jotform.ca/form/91238779847274?selectedFile=https://www.google.com/ 

    Where "https://www.google.com/" is your file's link to download. 

    With this workaround you will not use conditions and you only need to configure your form as explained above; however, note that this workaround requires to have access to the page where files are hosted in order to edit each download button URL, you may also pass this workaround to your developer so he/she can have a look and find if this would work for you.  

  • Profile Image
    lrogers_ariaconsulting
    Answered on May 14, 2019 at 12:09 PM

    "To pre-fill the hidden field with the file URL you will need to edit every single download button on the page where your files are hosted on, this way you can change the hyperlink to the Jotform URL with the file's link passed through the form URL:"

    Meaning, I need a copy of the jotform for every single file (since the button can only have a single URL assigned to it which would be the URL of the jotform). So, if I have to have as many copies of the form as I do files, why do I need to bother with anything other than just hard coding the link to the file?

  • Profile Image
    Mike_G
    Answered on May 14, 2019 at 02:56 PM

    The solution my colleague, Kevin_G, is proposing would only require you to have one form in JotForm. The value of the "Selected File" (hidden) field in that form will be the link to the file that will be downloaded which will be passed via the URL parameter.

    Here's a sample link that your respondents will be redirected to when they click the "Download" button on your website.

    https://form.jotform.com/91335838484972?selectedFile=https://ariawebfiles.blob.core.windows.net/webfiles/Test.docx

    The yellow highlight is the link to your form. The one in my sample link above is just a clone version of your form. In that clone version, I have disabled the "Hide" option of the "Selected File" field for testing purposes.

    The orange highlight is the field name of the "Selected File" field in your form. The explanation on how you can get this is explained in this guide (3rd step) — Prepopulating-Fields-to-Your-JotForm-via-URL-Parameters

    The blue highlight is the downlink link to your file. I have used the sample download link you have provided in one of your replies above.

    If you click the sample link, the form loads and you will notice the "Selected File" field in that form pre-populated with the download link.

    1557857974t14_17_41.png

    Now, since we have already managed to have the download link to your file appear in your form as a value of the "Selected File" field, we can set that field as the "Redirect to external link" of your form using its {uniqueName} — How-to-Find-Field-IDs-and-Names

    1557858911t14_23_09.png

    And when the form is submitted, whatever link there is in the "Selected File" field will load and will trigger the download.

    The value of the "Selected File" field in your form changes based on which download button is clicked on your website.

    This means that each Download button on your website will be redirected to the same form link (Single Form used) when clicked but will have a different "selectedFile" value (different download link).

    For example, the Download button under "Microsoft Content Services..." on your website will have https://form.jotform.com/91335838484972?selectedFile=https://sample.website.com/Test.docx and the Download button under the "Business Capability Map..." will have the same form but has a different download link — https://form.jotform.com/91335838484972?selectedFile=https://sample.website.com/Demofile.docx

    Different Download button, Same Form, different download link passed to the "Selected File" field of the form.

    I hope this helps. If you have other questions or concerns, please do not hesitate to let us know.


  • Profile Image
    lrogers_ariaconsulting
    Answered on May 14, 2019 at 09:53 PM

    Awesomeness!  This now finally WORKS!!!!

    VERY much appreciated, gents!!

  • Profile Image
    lrogers_ariaconsulting
    Answered on May 16, 2019 at 10:39 AM

    I have an additional question on this if I may?

    There is code available to have the Jotform show up in a shadow box.  Where do I inject that code in this kind of usage to get the form to open in a shadow box?

    Thank you again!

  • Profile Image
    Mike_G
    Answered on May 16, 2019 at 11:48 AM

    I have moved your concern to a new thread considering it is about another topic.

    https://www.jotform.com/answers/1825804

    Please click the link above to go to the new thread. I also suggest that you reply to that thread for any follow-up questions about your new concern to avoid confusion. We will be responding to the new thread soon.