Okay
  Public Ticket #1312268
Minimal Form Styling + Gravity Forms
Closed

Comments

  •  1
    phvntom started the conversation

    First of all, let me say that this is the most incredible theme we've worked with -of which there are many.  

    We are implementing Gravity Forms to produce leads via our new website.  We chose Salient for this site due to its speed, reliability, and unique list of features.

    We currently have a multi-page form on the afore mentioned URL.  For some reason, the date field is being assigned the class "has-text" by init.js, even before the user has visited the second page.  We tried many jQuery/JS overrides, but have had no luck.  The problematic field is on the second page of the form.  The div needs to initially be assigned the class "no-text" like every other input field to be acceptable.  As it is, the field appears to have some text when it clearly doesn't.  

    This issue only persists with the salient theme. We appreciate any insight you can provide.  We are comfortable manipulating the child theme and/or inserting javascript. Thanks for your assistance.


  •  2,744
    Andrew replied

    Hi phvntom,

    Sorry for the late reply.

    That class is added on salient\js\init.js: at line 13967 

    it's checks the input and text areas on the element with the CSS class minimal-form-input and sees if they have values and if they do that "has-text" class is added.

    The same check is done on 13976.
    That is on the checkValueOnLoad function - line 13974.

    You could try and work around this from there and if you need any further help then we can escalate this to the developers.

    Thanks.

  •  1
    phvntom replied

    Hey Andrew,

    Thanks for the response. We are actually aware of where and how the "has-text" class is added. The problem we're experiencing is that we can't override the function without altering the parent theme. It's difficult to determine exactly when the function runs because it still overrides our solutions that use (document).ready and/or a nested function.

    As previously noted, there is no text inside of the datepicker field. In fact, the function that runs on "blur" recognizes that there's no text and removes the class if you click on/off the field without entering anything. The problem specifically lies within checkValueOnLoad. Please have your developers investigate why that function insists on adding "has-text" to the empty datepicker field.

    Kind regards


  •  1
    phvntom replied

    Andrew,

    The problem was caused by a hidden Gravity Forms element that appended an icon to the input. The icon's "value" was the image's URL. The following script is effective in resolving the problem as long as an icon is not desired on the input field:

    <script>
    jQuery( document ).ready(function($) {
    $('[id^=gforms_calendar_icon_input]').val('');
    });
    </script>

    Please mark this ticket as resolved. 

    Thank you.