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

    Radio Button - with line to fill in

    Asked by Mermel6316 on December 28, 2016 at 12:03 PM

    Im trying to create a form which has a radio button but also a line to fill in text right next to it - how do I do that?

    Here is the link to my form https://www.jotform.com//?formID=63623825909161

     

    (I want a way for people to easily say if its in honor of in memory and for the name of the person)

     

  • Profile Image
    JotForm Support

    Answered by BJoanna on December 28, 2016 at 12:43 PM

    Radio button field can only have Other text box field like is already added on your form. 

    If you want to have text bot field next to each radio button option, you will need to add additional text box fields to your form and position them next to radio button options.

    https://www.jotform.com/help/90-Form-Field-Positioning 

    You will also need to add custom CSS code to position fields.

    https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

    I have made demo form: https://www.jotformpro.com/form/63625245554963 

    Inside of my demo form I have added two text fields (without labels) and I have added this CSS code:

    #id_19 {

        padding : 0;

        padding-top : 20px;

        padding-right : 200px;

    }

    #id_18 {

        padding : 0;

        margin : 0;

    }

    #id_12 {

        padding-right : 0px;

    }

    .form-radio-item {

        padding-bottom:20px!important;

        width:120px!important;

    }

    Feel free to clone it. 

    Hope this will help. Let us know if you need further assistance.