Splitting full name into separate fields on export

  • Profile Image
    aspirebrokers
    Asked on April 05, 2016 at 10:12 PM

    Hi Guys,

    In relation to my last question.  I see that the data does export in separate fields however when I integrate with Zapier it shows as one field.  If this a question for them?

  • Profile Image
    Chriistian
    Answered on April 06, 2016 at 12:36 AM

    Unfortunately it is not possible to split the Full Name field into separate fields with the Zapier integration. A possible workaround would be to use two plain text-boxes and label them as First Name and Last Name fields. 

    If you need further assistance, please let us know.
    Regards.

  • Profile Image
    aspirebrokers
    Answered on April 06, 2016 at 12:38 AM

    This is a real pain.  The user interface on the full name is really nice.  Is there a way to recreates the "full name" look and feel while having two separate fields?

  • Profile Image
    Chriistian
    Answered on April 06, 2016 at 02:23 AM

    You can shrink the two fields together and use css to modify their appearance and make them similar to the Full Name field.

    1. Add a text field as the label.

    2. Shrink the two text-boxes.

    3. Add sub-labels "First" and "Last"

    4. Then inject the custom css below. 

    #id_392 {

        padding-right: 0px;

    }

    #id_393 {

        padding-left: 0px;

    }

    #input_393, #input_392 {

        width: 150px;

     

    }

    The field should now look like the screenshot below.

    You can check out this cloned form where I injected the css: https://form.jotform.com/60960823676969. You can also clone it to your account if you like.

    If you need further assistance, please let us know.
    Regards.

  • Profile Image
    aspirebrokers
    Answered on April 06, 2016 at 02:47 AM

    This is brilliant.  Thanks.  It goes a bit strange when the screen size changes though

    http://snag.gy/oZBGo.jpg

     

    The full name version says nice an compact - http://snag.gy/sRtmO.jpg

    Maybe I am better to just split it?

  • Profile Image
    Chriistian
    Answered on April 06, 2016 at 04:04 AM

    You can inject the additional code below to make the field responsive on mobile:

    @media only screen and (max-width: 500px){

    #id_394 {

        margin-top: 0px;

        margin-bottom: 0px;

        padding-top: 0px;

        padding-bottom: 0px;

    }

    #id_394 p{

        margin: 0px;

    }

    #id_392, #id_393 {

        padding-right: 0px;

        padding-top: 0px;

        padding-bottom: 0px;

        margin-top: 0px;

        width: 200px;

    }#id_392{width:190px}

    Here's the link to the form where I tested the css: https://form.jotform.com/60960823676969 

    If you need further assistance, please let us know.
    Regards.