PLEASE NOTE: These forums are no longer utilized and are provided as an archive for informational purposes only. All support issues will be handled via email using our support ticket system. For more detailed information on this change, please see this blog post.

Font Color Change - Input Fields

  1. studio57designs
    Member

    Hi,

    I have a client that is using default text in the input fields of a gray color.

    What we want to do is change the font color of the input fields that have been changed, so you can tell the difference between the fields that have been changed and the ones that still need to be answered.

    Is that possible?

    Please advise,

    Louise
    Studio 57 Designs

    Posted 7 years ago on Monday September 17, 2012 | Permalink
  2. Please post a link to the page where the form is embedded and we will try to help you.

    Posted 7 years ago on Wednesday September 19, 2012 | Permalink
  3. studio57designs
    Member

    Chris,

    Wish I could but its on a development site and locked down. Can I post code instead?

    Louise

    Posted 7 years ago on Wednesday September 19, 2012 | Permalink
  4. How about if you export the form as XML (Forms > Import/Export > then the top menu item "Export Forms") and email it to me at chris@rocketgenius.com and I will install it and take a look at configuring it. I don't think there is built in functionality in Gravity Forms to do what you want, but maybe there is a jQuery script we can use. Have you seen an example of a form working like this in the wild so I could take a look?

    Posted 7 years ago on Thursday September 20, 2012 | Permalink
  5. studio57designs
    Member

    Chris,

    I've seen examples using jQuery on the net but I could not figure out how to implement. Let me see what I can do to get the XML file to you.

    Louise

    Posted 7 years ago on Friday September 21, 2012 | Permalink
  6. studio57designs
    Member

    Chris, I apologize for the delay. I am emailing the XML file to you now as well as a jquery example link.

    Louise

    Posted 7 years ago on Thursday October 11, 2012 | Permalink
  7. Take a look at this revised code. It will add or remove a class based on whether the placeholder text was changed or not. http://pastebin.com/weLKhfzb

    With that, you will need to add classes to your theme's stylesheet for both .complete and .incomplete. Here is the CSS I used:

    [css]
    body .gform_wrapper form .complete {
            color: red;
            font-weight: bold;
    }
    body .gform_wrapper form .incomplete {
    }

    Working example: http://gravity.chrishajer.com/census/

    Let me know if you have any questions.

    Posted 7 years ago on Monday October 22, 2012 | Permalink
  8. I heard back from Louise that this code worked fine.

    Posted 7 years ago on Tuesday October 23, 2012 | Permalink