WordPress.org

Ready to get started?Download WordPress

Forums

Contact Form 7
How to make Validation Errors NOT disappear on hover. (6 posts)

  1. dfiller
    Member
    Posted 1 year ago #

    Is there a way to make these errors stay visible until the form is submitted again?

    Thanks!

    http://wordpress.org/extend/plugins/contact-form-7/

  2. hieu.nguyen
    Member
    Posted 11 months ago #

    I have tried high and low, this piece of jquery is located here: wp-content/plugins/contact-form-7/includes/js/scripts.js

    $('span.wpcf7-not-valid-tip').mouseover(function() {
    				$(this).fadeOut('fast');
    			});

    However I don't know how to disable this, without hacking this file - which is what I really don't want to do.

    Any recommendations?

  3. verify
    Member
    Posted 10 months ago #

    Hi, I believe you can override the function in your theme. In my case, I insert the Form shortcode by do_shortode() function, so I insert the overriden function directly after it and it works. So in my footer.php, the block of code looks like this:

    <?php echo do_shortcode('[contact-form-7 id="8" title="Footer Contact Form"]'); ?>
    
    <script type="text/javascript">
    	jQuery(function($) {
    		$.fn.wpcf7NotValidTip = function(message) {
    			return this.each(function() {
    				var into = $(this);
    				into.append('<span class="wpcf7-not-valid-tip">' + message + '</span>');
    				into.find(':input').focus(function() {
    					into.find('.wpcf7-not-valid-tip').not(':hidden').hide();
    				});
    			});
    		};
    	});
    </script>

    Hope it helps.

  4. Innovnate
    Member
    Posted 10 months ago #

    ok so where would I put that code if I'm putting in the contact form via a standard shortcode rather than function?

  5. hieu.nguyen
    Member
    Posted 10 months ago #

    @verify: good idea. My developer also did something similar.

    @Innovnate: you can put it at the end of the template file (of that page).
    For example, if that page is contact, you can look for template page-contact.php or something similar and place the code there.

    This is my dev's code:

    <script>
    	jQuery(function($){
    		$.fn.wpcf7NotValidTip = function(message) {
    	        return this.each(function() {
    	            var into = $(this);
    	            into.append('<span class="wpcf7-not-valid-tip">' + message + '</span>');
    	            $('span.wpcf7-not-valid-tip').mouseover(function() {
    	                //$(this).fadeOut('fast');
    	            });
    	            into.find(':input').mouseover(function() {
    	                //into.find('.wpcf7-not-valid-tip').not(':hidden').fadeOut('fast');
    	            });
    	            into.find(':input').focus(function() {
    	                //into.find('.wpcf7-not-valid-tip').not(':hidden').fadeOut('fast');
    	            });
    	        });
    	    };
    	});
    </script>
  6. hieu.nguyen
    Member
    Posted 10 months ago #

    He simply commented-out those lines, and the by that override the fadeOut effect of the default contact file.

    Not the best solution, but definitely acceptable, no core-hacking.

    You do need to document this though, if in the future the plugin dev decides to change the code, you will have to change according to his new code :-)

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.