WordPress.org

Support

Support » Plugins and Hacks » [Resolved] [Plugin: Contact Form 7] CF7 won't allow onblur or onfocus

[Resolved] [Plugin: Contact Form 7] CF7 won't allow onblur or onfocus

  • swmagic999
    Participant

    @swmagic999

    I’ve seen this syntax used before for pre-filling a field, then when the user clicks in the field it goes blank, only to refill field if they press tab.

    <input id=”inf_field_FirstName” class=”form_text” type=”text” name=”inf_field_FirstName” onblur=”if (this.value == ”) {this.value = ‘ first name’;}” onfocus=”if(this.value == ‘ first name’) {this.value = ”;}” value=” first name” size=”7″>

    Is this doable in Contact form 7? I can’t find any CSS to handle this.

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

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Takayuki Miyoshi
    Participant

    @takayukister

    You can use watermark option like this:

    [text your-firstname watermark "First Name"]

    Text Fields

    shanafourde
    Member

    @shanafourde

    Shubham Vijay
    Member

    @tigershubham

    Contact Form 7 is one of our favorite form plugins because its updated regularly and there are a ton of extensions you can install that make the user-experience that much more rewarding; our favorite is the Database Extension. One feature that people have been asking about for quite some time is the ability to clear the default value of a field onClick or onFocus. This can be done easily by changing a couple lnes of code in the plugin, but remember, when you upgrade Contact Form 7, you’ll need to reapply this change.

    On line 89 in this file:
    /wp-content/plugins/contact-form-7/modules/text.php

    Replace this:
    89 $html = '<input type="text" name="' . $name . '" value="' . esc_attr( $value ) . '"' . $atts . ' />';

    With this:

    89	$html = '<input type="text" name="' . $name . '" value="' . esc_attr( $value ) . '"' . $atts . ' onfocus="if(this.value==\'';
    90	$html = $html . esc_attr( $value ) . '\') this.value=\'\';" onblur="if(this.value==\'\') this.value=\'' . esc_attr( $value ) . '\';" />';

    And on line 88 in this file:
    /wp-content/plugins/contact-form-7/modules/textarea.php

    Replace this:
    88 $html = '<textarea name="' . $name . '"' . $atts . '>' . esc_html( $value ) . '</textarea>';

    With this:
    88 $html = '<textarea name="' . $name . '"' . $atts . ' onblur="if (this.value == \'\') {this.value = \'' . esc_html( $value ) . '\';}" onfocus="if (this.value == \'' . esc_html( $value ) . '\') {this.value = \'\';}">' . esc_html( $value ) . '</textarea>';

    With those 2 tweaks you should be able to clear the default value each time the user clicks the text field or text area.

    [Please post code or markup snippets between backticks or use the code button. Your posted code may now have been permanently damaged by the forum’s parser.]

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘[Resolved] [Plugin: Contact Form 7] CF7 won't allow onblur or onfocus’ is closed to new replies.