API: Creating submission using javascript shows [object Object] for grouped fields like Full Name and Address

  • Profile Image
    Tentrr
    Asked on August 05, 2019 at 06:22 PM

    Hey guys,

    I'm working with the JS SDK and am trying to submit responses. I've read over the documentation(https://api.jotform.com/docs/#post-submission-id) but I seem to be missing something.

     

    I'm able to submit all my answers without issue except for multi field components (e.g. control_address and control_fullname). Would you be able to provide a sample JSON for the submission I would provide to the `createFormSubmission` method please? The API doesn't seem to accept objects, only arrays and strings, but I cannot find the correct key structure for the submision for the API to pick up the various fields. 

     

    Thank you, 

    Nick

     

    EDIT:

    My submissions are successful, but the address and name fields are either empty when viewing submissions, or only one of the fields is captured (this only happens with the fullname component). 

    I'm looking for the correct structure of what my submission should be if I have: 
    qid of 260
    name of whereIs
    with the fields: addr_line1, addr_line2,  city, state, postal

     

    one more EDIT:

    For example, I've tried submitting various riffs on this structure: 

    1. 260[addr_line1]"sadf"
    2. 260[addr_line2]"asdff"
    3. 260[city]"asdf"
    4. 260[postal]"asdf"
    5. 260[state]"asdf"
  • Profile Image
    EltonCris
    Answered on August 05, 2019 at 08:36 PM

    The structure should be: submission[qid][arrayname]

    So for the first name;

    submission[qid][first]

    submission[qid][last]

    Example: submission[3][first]

    Same for your address field;

    submission[260][addr_line1]

    submission[260][addr_line2]

    submission[260][city]

    submission[260][state]

    submission[260][postal]

    submission[260][country]

    This should work.

  • Profile Image
    Tentrr
    Answered on August 05, 2019 at 08:44 PM

    1565052175Screen Shot 2019-08-05 at 8.42

    Hey, thank you for the response. This is my submission object. Can you point out where I'm going wrong? 

  • Profile Image
    EltonCris
    Answered on August 05, 2019 at 10:32 PM

    Have you tried the 2nd element names with quotes?

    Example:

    254["first"]

    254["last"]

    That might work.

    You may also break it down by only submitting the name and see if that works.

    submission[254]["first"]

    submission[254]["last"]

  • Profile Image
    Tentrr
    Answered on August 06, 2019 at 01:40 PM

    Hi! 

    Thanks for continuing to respond. Unfortunately, that didn't help either. I submitted the following structure: 
    1565112972Screen Shot 2019-08-06 at 1.35


    ... and got the following response from the server: "QuestionID not found on form questions!"

    This is the response I usually get when trying different patterns to get these form components to submit correctly. When I get a 200 back, when viewing submissions, the answers for these form components are either blank or [object Object].


    I've tried just submitting one key for these form components by running a JSON.stringify() on all the object, and that seems to display ok inside the console (albeit with quotation marks and curly braces surrounding everything), but when exporting to CSV or xlsx or PDF, the fields are blank. 


    Any more assistance with this would be great.. a JSON sample would be ideal. Thank you! 

  • Profile Image
    Kiran
    Answered on August 06, 2019 at 02:53 PM

    Could you check the sample output from the Get Submission and use the same format to send the submission using API?

    https://api.jotform.com/docs/#submission-id

    Please give it a try and let us know if you need any further assistance. We will be happy to help. 

  • Profile Image
    Tentrr
    Answered on August 06, 2019 at 05:19 PM

    Hi Kiran, 

    Yes, I read the documentation. It's the same link in my first post. And i'm specifically asking about formatting of my submission to the API. Please take a look at the screenshots i posted above of a few of my submission attempts and provide a sample JSON or JS object illustrating the correct structure. That would be the most helpful I think. Thank you guys. 

  • Profile Image
    EltonCris
    Answered on August 06, 2019 at 06:32 PM

    We made some tests and it seems "submission" isn't necessary for JSON. Try it without the "submission" property and then format the fields with array values like the following.

    Example:

    {

    "254": {

    "first": "John",

    "last": "Doe"

    },

    "260": {

    "addr_line1": "My Street1",

    "addr_line2": "My Street2"

    }

    }

    This works for me:

     

  • Profile Image
    Tentrr
    Answered on August 07, 2019 at 12:47 PM

    Thank you.. this is what I was looking for! However.. this is also what I originally had. I'm submitting this: 

    {253: ["Earning extra annual income"]

    254: {first: "asdf", last: "asdf"}

    255: 20

    258: ["VRBO"]

    260: {addr_line1: "sadf", addr_line2: "asdff", city: "asdf", state: "asdf", postal: "asdf"}

    261: "f"

    272: ["Beach"]

    277: "Yes"

    278: "Yes"

    283: "https://www.jotform.com/uploads/Tentrr/form_files/Onboarding-Plans2-fox2.5d408e5c3dbbe9.23722574.jpg"}


    Viewing this in the submissions, I see this:


    1565196378Screen Shot 2019-08-07 at 12.4


    Exporting this in any format yields blanks. Any ideas guys? 


    jotform.createFormSubmission(formID, submission, callback)
  • Profile Image
    EltonCris
    Answered on August 07, 2019 at 07:38 PM

    I was able to reproduce that problem.

    After checking the JotForm.js source code, I found out that the serialization of data does not support nested objects. I have addressed this to our developers for further investigation.

    For now, you can try this solution. It should work.

    Take the JotForm.js offline and then find and modify the serialize function.

    FROM:

        function serialize(data) {

              var str = [];

              for(var p in data)

                 str.push(encodeURIComponent(p) + "=" + encodeURIComponent(data[p]));

              return str.join("&");

        }

    TO:

    function serialize(data, prefix) {

      var str = [],

        p;

      for (p in data) {

        if (data.hasOwnProperty(p)) {

          var k = prefix ? prefix + "[" + p + "]" : p,

            v = data[p];

          str.push((v !== null && typeof v === "object") ?

            serialize(v, k) :

            encodeURIComponent(k) + "=" + encodeURIComponent(v));

        }

      }

      return str.join("&");

    }

     

    That should fix the problem. If in case you can't get the authentication to work, just use;

    JF.initialize( {apiKey: "YOUR API KEY HERE"} );

    Let us know how it goes. Thanks!

  • Profile Image
    Tentrr
    Answered on August 13, 2019 at 12:47 PM

    Hi Elton, 

    Sorry for disappearing off the thread.. It was crunch time and I needed a solution so I came up with an alternative. Thank you for the code sample though.. I'm glad I wasn't going crazy. Hopefully this will make it in to your guys' next release! 

    Consider this one closed. :)