What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    How to pass parameters with lightbox?

    Asked by antoniooi on February 09, 2011 at 12:11 PM

    Hi,

    How can I pass parameters to prepopulate certain form fields if I'm embedding form using lightbox?

    Thanks in advance!

    Antonio

    Feature Lightbox QueryString
  • Profile Image
    JotForm Founder

    Answered by aytekin on February 10, 2011 at 01:41 AM

    I don't know if this would work, but you can give it a try.

    Try changing this line on the code:

    formId:'10403856109',

    to this:

    formId:'10403856109?name=Antonio&',

  • Profile Image

    Answered by antoniooi on February 17, 2011 at 06:55 AM

    Hi,

    Sorry, just have time to test on it. Well, I tested with the following but not working:

    formId: '10391233108?coursetitle=HRM%20-%20Industrial%20Relation%20Management'

    Few questions here:

    1. How do we know the parameter ID for each of our label field? E.g. my Course Title is the first field of the form, how would it be identified by JotForm in query string?

    2. Is the above parameter value correct?

    I understand that the given solution has yet to be official by JotForm, but I have a few suggestions here:

    1. We may have certain fields with long label, can we have the form fields to be identified as Field<IndexNo> rather than field label text without spaces?

    2. Can we have multiple selections for, say, a set of checkboxes? E.g. ?develiverymethods=1,3,9 where 1, 3, and 9 are indexes of the checkboxes?

    Appreciate if you can feedback. Thanks!

    P/S: Your current implementation for checkbox default value seemed to be not supporting multiple default selections?

    Antonio

  • Profile Image
    JotForm Founder

    Answered by aytekin on February 22, 2011 at 08:10 AM

    1. How do we know the parameter ID for each of our label field? E.g. my Course Title is the first field of the form, how would it be identified by JotForm in query string?

    Look at the source code of the form. Each field has a "name" field.

    2. Is the above parameter value correct?

    No, here is how to do it:

    10391233108?courseTitle=EHS%20-%20High%20Performing%20Safety%20and%20Health%20Committee

  • Profile Image

    Answered by antoniooi on February 22, 2011 at 08:23 AM

    No? I thought yours and mine are similar?

    formId: '10391233108?coursetitle=HRM%20-%20Industrial%20Relation%20Management'

    and

    10391233108?courseTitle=EHS%20-%20High%20Performing%20Safety%20and%20Health%20Committee

    You also mean that we do it at the embedded JavaScript side right?

  • Profile Image
    JotForm Founder

    Answered by aytekin on February 22, 2011 at 02:30 PM

    Case matters. It should be courseTitle. The answer should also be exactly same as dropbox.

    I am not sure if it will work with jsform. You should probably include this on the URL of the iframe code.

    Here is how you can get the IFrame code. Open your form on the Form Builder:
    1. Open "Setup & Share" tab on toolbar,
    2. Click on "Embed Form"
    3. Click on iFrame and copy the code provided.

  • Profile Image

    Answered by antoniooi on March 14, 2011 at 09:32 AM

    Able to make it works for lightbox so far?

    Thanks.

  • Profile Image
    JotForm Support

    Answered by liyam on March 16, 2011 at 10:00 PM

    Hello,

    I've tried checking out how to do this but so far I'm not successful.

    I will submit a ticket to our development team to see if there is a way for this to be done.

    Thanks.

  • Profile Image

    Answered by novastor on March 24, 2011 at 01:26 PM

    I can't seem to find out how to do this either. Changing the formID: "#########?parameter=value" will not work because if you veiw the source of the lightbox it is already appending "?" to the end of the formID.

    If the Jotform's javascript code included an additional setting like the others (formID, buttonText, background, etc) and just called it "parameter" where you would simply define the form fields like with normal use of the URL parameters being passed, then it would just append it to the end. See below.

     

    new JotformFeedback({

    formId: "#########",

    buttonText: "Contact Us",

    parameter: "formfieldname1=value1&formfieldname2=value2",

    base: "http://www.jotform.com/",

    background:'#1B95BC',

    fontColor:'#FFFFFF',

    buttonSide: "right",

    buttonAlign: "center",

    type:1,

    width: 320,height: 340});

     

  • Profile Image
    JotForm Support

    Answered by liyam on March 25, 2011 at 05:18 AM

    So far this is still in the feature todo list of our development team.

    The only solution I could think of at the moment is to have your form hosted to your own domain.  Get the javascript file and then find this:

    this.options.iframeParameters.toQueryString()+"\"

    Now, hard code the parameters before \"

    example:
    this.options.iframeParameters.toQueryString()+"yourName15[first]=John&yourName15[last]=Smith\"

    Save your .js file and this will prepopulate the fields.

    If you wish to put variables here, that is still something that I'm trying to figure.

    Hope this helps.

  • Profile Image
    JotForm Support

    Answered by seyhuns on March 26, 2011 at 12:53 PM

    Hello,

    You can use parameters by adding you pairs to iframeParameters like this:

    new JotformFeedback({

    formId: "#########",

    buttonText: "Contact Us",

    iframeParameters: {

         'formfieldname1'='value1',

         'formfieldname2'='value2'

    },

    base: "http://www.jotform.com/",

    background:'#1B95BC',

    fontColor:'#FFFFFF',

    buttonSide: "right",

    buttonAlign: "center",

    type:1,

    width: 320,height: 340});

     

    Thank you.

    ===========================================

    CORRECTION:

    iframeParameters: {

         'formfieldname1':'value1',

         'formfieldname2':'value2'

    },

     

     

  • Profile Image

    Answered by antoniooi on March 27, 2011 at 04:35 AM

    Thanks  seyhuns, but I want to make the parameters vary at the calling side, not much at the declaration side. The default values pre-populating feature had already been provided by JotForm (except the multiple default values for checkboxes).

    To take a look:

    1. Go to: http://www.multidimension-pg.net/2011/01/industrial-relation-management.html

    2. Click on Notify me when available under Schedule & Venue --> Public Training.

    3. Notice that I can't dynamically select the training course title Industrial Relations Management except asking our visitors to re-select again (which sounds a little stupid).

    Hope you get the idea now.

    Thanks.

    Antonio

  • Profile Image

    Answered by antoniooi on March 27, 2011 at 04:40 AM

    OK, I get your idea now:

    You mean I can actually duplicate the declarative code across each page (which may have different prepopulation requirements) rather than make it global at the master page? Is that what you mean?

    Thanks!

    Antonio

  • Profile Image

    Answered by antoniooi on March 29, 2011 at 03:23 AM

    But this will be too costly to me as I will need to remove the global declaration and implement it on each of my local content pages. When the solution is available, again, I will need to do the same in order to have a more symantic and cleaner implementation.

    I think I would better wait for your solution (not workaround). Any advice would be appreciated.

    Thank you.

    Antonio

  • Profile Image

    Answered by gjenkins on March 31, 2011 at 11:48 AM

    Hi guys, I'm trying to do the same - pass parameters into a Lightbox.  It's not clear to me whether your answer was actually a usable solution for Lightboxes Seyhuns.  The code I'm trying is as follows:

     

    <script src="http://www.jotform.com/min/g=feedback" type="text/javascript">
    new JotformFeedback({
    formId:'##########',
    base:'http://www.jotform.com/',
    windowTitle:'Website error form',
    background:'#000000',
    fontColor:'#FFFFFF',
    type:1,
    height:500,
    width:620
    });
    </script>
    <a id="lightbox-#########" style="cursor:pointer;color:blue;text-decoration:underline;">Website error form</a>

    I'm getting the following Jscript error though: 

    Message: Expected ':'
    Line: 939
    Char: 1295
    Code: 0
    URI: http://www.jotform.com/min/g=feedback

     

  • Profile Image

    Answered by gjenkins on April 01, 2011 at 11:34 AM

    Apologies, I pasted that original code in wrongly.  It should have read:

    <script src="http://www.jotform.com/min/g=feedback" type="text/javascript">
    new JotformFeedback({
    formId:'##########',
    base:'http://www.jotform.com/',
    iframeParameters: {
         'formfieldname1'='value1',
         'formfieldname2'='value2'
    },
    windowTitle:'Website error form',
    background:'#000000',
    fontColor:'#FFFFFF',
    type:1,
    height:500,
    width:620
    });
    </script>
    <a id="lightbox-#########" style="cursor:pointer;color:blue;text-decoration:underline;">Website error form</a>

    I'm suspecting however that the code example that you gave, Seyhuns, was for an iframe integration, not a Lightbox one. 

    Any help appreciated!

    Thanks

     

  • Profile Image
    JotForm Support

    Answered by seyhuns on April 15, 2011 at 05:31 AM

    Hi all,

    Sorry for the latency, I made a mistake and I gave the wrong code to all, also sorry for this too. Here is the right one, this can be used both in Feedback and Lightbox options.

    <script src="http://www.jotform.com/min/g=feedback" type="text/javascript">
    new JotformFeedback({
    formId:'##########',
    base:'http://www.jotform.com/',
    iframeParameters: {
         'formfieldname1':'value1',
         'formfieldname2':'value2'
    },
    windowTitle:'Website error form',
    background:'#000000',
    fontColor:'#FFFFFF',
    type:1,
    height:500,
    width:620
    });
    </script>
    <a id="lightbox-#########" style="cursor:pointer;color:blue;text-decoration:underline;">Website error form</a>

  • Profile Image

    Answered by antoniooi on April 15, 2011 at 05:47 AM

    Looks cool and clean! Let me try out later and feedback to you guys!

    Thanks!

  • Profile Image

    Answered by m4mpfi on December 28, 2014 at 07:25 PM

    Hi

    My iframe Parameters should be different depending on which button I click to promp the jotform lightbox. For example I have two buttons: "Open Jotform lightbox with default value 20" and "Open Jotform lightbox with default value 100".

    How can I solve this with JS without copy the whole code (constuctor) for each parameter I need?

    I tried to bind another click function to the button and overwrite iframeParameters object, after defining JotformFeedback as a variable, but  that didn't work.

    Any advice?

     

    I tried this:

     var JFL_1337 = new JotformFeedback({
                      formId:'1337',
                      base:'https://secure.jotformeu.com/',
                      windowTitle:'Shop',
                      background:'#FFA500',
                      fontColor:'#FFFFFF',
                      type:1,
                      height:500,
                      width:700,
                      openOnLoad:false,
                      iframeParameters: {
                           'total':'2000'
                      }
     });

     $('#testbtn').on('click', function(e){
        JFL_1337.iframeParameters = {
              'total':'999'
         }
      });

  • Profile Image
    JotForm Support

    Answered by ashwin_d on December 28, 2014 at 11:11 PM

    Hello m4mpfi,

    I am not sure but I believe it is possible to achieve your requirement by adding the value as a variable. 

    This thread is a very old thread and I have moved your question to a new thread. We will discuss and answer your question in the following thread: http://www.jotform.com/answers/483189 

    Thank you!