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

    Dropdown field border color on error

    Asked by oxinst on October 18, 2013 at 04:41 AM

    Hi, I'm trying to change the border color on the dropdown, for an error alert when the field is required.  I have got this working for text fields, but what CSS do i need to inject for the dropdown field?

     

    Page URL:
    http://www.oxford-instruments.com/investors

    Screenshot
    dropdown field border color
  • Profile Image

    Answered by jedcadorna on October 18, 2013 at 07:45 AM

    Hello,

    Thank you for contacting us. You can download your form source and add this code into your source code.

    Add border:1px solid red; 

    ex.

    <select class="form-dropdown validate[required] form-validation-error" style="width:182px; border:1px solid red;" id="input_6" name="q6_whichCategory6">

     

    Please see the attached image.

     

    Thanks,

  • Profile Image

    Answered by jedcadorna on October 18, 2013 at 07:53 AM

    In addition to what I've posted previously instead of downloading the form source, inject this CSS code instead.

    .form-dropdown{border:1px solid red;}

     

    Sample:

     

     

    Let us know if you have other questions.

    Thanks,

     

  • Profile Image

    Answered by oxinst on October 23, 2013 at 11:23 AM

    @jedcadorna, thanks for the reply.  I can't use the first option as I use javascript method for inserting the form.  On the second option, this give a permenant red line around the field.  I just want to have the border when the form errors because of an imcomplete field.  See here, at the moment, on error the field has a green border http://www.oxford-instruments.com/investors?src=tn  Thanks

  • Profile Image

    Answered by pinoytech on October 23, 2013 at 12:08 PM

    Hi,

    Inject this custom css into your form in order to fixed the issue.

    .form-validation-error {

    border: 1px solid red !important;

    -moz-box-shadow: 0 0 2px red !important;

    -webkit-box-shadow: 0 0 2px red !important;

    box-shadow: 0 0 2px red !important;

    }

    Please take a look at this clone form: http://www.jotformpro.com/form/32954348132960

    Feel free to contact us again if you need further assistance.

    Thank you!

  • Profile Image

    Answered by oxinst on October 24, 2013 at 09:04 AM

    @pinoytech.  Great thanks. Working nicely now.

  • Profile Image

    Answered by pinoytech on October 24, 2013 at 10:53 AM

    It's my pleasure! If you need our assistance again, please don't hesitate to contact us at anytime.

    Have a nice day!