Dropdown field border color on error

  • Profile Image
    oxinst
    Asked 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?

     

  • Profile Image
    jedcadorna
    Answered 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
    jedcadorna
    Answered 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
    oxinst
    Answered 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
    pinoytech
    Answered 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
    oxinst
    Answered on October 24, 2013 at 09:04 AM

    @pinoytech.  Great thanks. Working nicely now.

  • Profile Image
    pinoytech
    Answered 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!