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

    Change the pink background in "This field is required" bubble.

    Asked by tomchen on April 19, 2012 at 11:20 PM

    Is there any way to change the color of the bubble?

    Also, I noticed that when this bubbles appear, it takes up space and moves my dropdowns into a second row. For example, I have 5 dropdowns on one row. If the bubble appears, then 2 dropdowns are moved to a second row. This makes the whole form look unorganized.

    Thanks again for your great help JotForm

  • Profile Image
    JotForm Support

    Answered by jonathan on April 20, 2012 at 03:32 AM

    Hi,

    I tested your form, and I was able to prevent the dropdowns from moving everytime the 'required' message happens. I did this by adjusting the size of spacing of the question fields to 1. Go to

    1. Setup & Embed
    2. Preferences
    3. Field Styles
    4. Question Spacing

    As for the changing the color of the bubble, you may want to checkout this thread.

    http://www.jotform.com/answers/35144-CAN-I-CHANGE-THE-COLOR-OF-THE-WARNING-AND-ERRORS

    Wayne(abajan) had a most comprehensive write ups on CSS there. =)

    Hope this help. Thanks.

  • Profile Image

    Answered by tomchen on April 20, 2012 at 04:10 AM

    Thanks, indeed Wayne's got all the CSS hookups!

    I actually found another code (also from Wayne) to just have the red outline and warning at the submit button at the bottom. However, I came across 2 problems:

    1. there is no red outline for Full Name and E-mail. I marked it Required

    2. The error message (There are incomplete required fields. Please complete them.) doesn't look well aligned. Is there any way to but it on one line under/above the submit button? I know that my form width is restricting it and the last word is on a second line.

     

    Thanks.

  • Profile Image
    JotForm Support

    Answered by jonathan on April 20, 2012 at 04:42 AM

    tomchen,

    1. Yes, I cannot see this too.

    2. This one, on my end, there is no 'required message' at all (using chrome). The only indication I am seeing is the red outline on the required fields (but no message, so I cannot see it if aligned or not)

    Perhaps you should clear the injected CSS first and put them back piece by piece to be able to track the one causing the conflict.

    I will try check also.

    Thanks.

  • Profile Image
    JotForm Support

    Answered by abajan on April 20, 2012 at 05:43 AM

    @tomchen

    "There are incomplete required fields. Please complete them." can be made to appear below the submit button by adding the following rule:

    .form-button-error {
    display: block;
    margin-top: 5px;
    }

    I actually think the message should be displayed in this manner by default because when appearing on the same line, it shifts the submit button which doesn't look good. I'll submit a ticket about this later.

    As to the red outline not appearing in the Full Name and E-mail fields, it's a bit of a mystery to me. I'll look into it and get back to you.

  • Profile Image
    JotForm Support

    Answered by abajan on April 20, 2012 at 05:57 AM

    Okay, I found the solution. Add the following rule:

    .form-line-error .form-textbox {
    border-color: red;
    }

    If you need further assistance with anything, please let us know.

  • Profile Image
    JotForm Support

    Answered by jonathan on April 20, 2012 at 06:05 AM

    tomchen,

    Wayne's rule works. =) I tried also on the clone of your form.

    FYI

    Thanks.

  • Profile Image

    Answered by tomchen on April 20, 2012 at 07:13 AM

    red box for full name and email - check

    incomplete message below submit button - check

     

    can't thank you enough for your great customer support. you guys are unbelievable!

  • Profile Image
    JotForm Support

    Answered by jonathan on April 20, 2012 at 07:48 AM

    Thank you for updating us tomchen.
    Check us out should you require assistance with JotForm again.  =)