WordPress.org

1. s.reynolds
   Member
   Posted 1 year ago #

   I am trying to erase the the form fields when you click on them so the value displays then erase on focus.

   Currently I have the input fields working by editing the modules/text.php file but i cant for the life of me get the textfield work with on focus.

   this is what i have in the textarea.php

   $html = '<textarea name="' . $name . '" value="' . esc_attr( $value ) . '"' . $atts . ' onfocus="if(this.value==\'';

   $html = $html . esc_attr( $value ) . '\') this.value=\'\';" onblur="if(this.value==\'\') this.value=\'' . '\';" </textarea>';

   it almost works, apart for some reason it adds this tag ">" just before the closing textarea like this

   <textarea onblur="if(this.value=='') this.value='';" onfocus="if(this.value=='Your Message') this.value='';" rows="4" cols="15" class="wpcf7-validates-as-required" id="mf_message" value="Your Message" name="your-message"></textarea>

   I dont know too much about php but I dont know why it adds this tag and I think this is why its not working.

   Any thoughts?

   Cheers

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

2. Wiki Chaves
   Member
   Posted 1 year ago #

   Hi,

   I've edited mudules/text.php and replaced Line 89 with this

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


   Cheers,
   Wiki

3. Wiki Chaves
   Member
   Posted 1 year ago #

   I've made a small corretion to this, to return the original value in case somebody leave the input blank.

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

   wiki

4. vmercader
   Member
   Posted 1 year ago #

   THAAAAAAAAAAAAANK.... YOUUU..... The Original poster forgot to thank you, but I'll do it for him.... thank you.

5. Wiki Chaves
   Member
   Posted 1 year ago #

   your wellcome :)

6. theresacambria
   Member
   Posted 1 year ago #

   I've been trying to accomplish this for quite some time, so I feel the need to repeat - @wiki THANK YOU!

7. theresacambria
   Member
   Posted 1 year ago #

   I applied the second bit of code that Wiki provided to the textarea.php file, but changed the input type to textarea instead of just text to accommodate a "Comments" box.

   The onfocus/onblur functionality works like a charm but now the field only allows one line of text in the middle of the box, instead of multiple lines starting at the top of the box.

   Here is the code I used plus a little of what comes just before it and just after:
   

   if ( ! empty( $content ) )
   			$value = $content;
   	}
   // Default value disappears onfocus, reappears onblur if still empty
   $html = '<input type="textarea" name="' . $name . '" value="' . esc_attr( $value ) . '"' . $atts . 'onfocus="if(this.value==\'';
   $html = $html . esc_attr( $value ) . '\') this.value=\'\';" onblur="if(this.value==\'\') this.value=\'' . esc_attr( $value ) . '\';" </textarea>';
   
   	$validation_error = '';
   	if ( is_a( $wpcf7_contact_form, 'WPCF7_ContactForm' ) )

   Any help would be much appreciated!

8. vmercader
   Member
   Posted 1 year ago #

   Oh, and, using the idea that Wiki provided, I've modified it a little bit and came up with this (applied to text.php):

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

   you can see this code applied on this website: http://www.talyst.com

   For textarea.php, use:
   $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>';

9. theresacambria
   Member
   Posted 1 year ago #

   Thank you, vmercader. Thats exactly what was needed for the textarea.

10. s.reynolds
    Member
    Posted 1 year ago #

    Perfect! sorry for the late reply.

    know one commented on my post for some time so i forgot about it.

    I eventually used some javascript to clear the text onfocus but recently had some issues with it so came back here and this was exactly was I was looking for.

    Thanks so much Wiki Chaves and vmercader.

    I hope they add this functionality to future updates, would be nice.

    Cheers

11. mihirx
    Member
    Posted 1 year ago #

    first, thanks Wiki Chaves and vmercader :)

    In contact-form-7.2.3.1

    in /wp-content/plugins/contact-form-7/modules/text.php

    replace this: (line 86)

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

    with this:

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

    in /wp-content/plugins/contact-form-7/modules/textarea.php

    replace this: (line 85)

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

    with this:

    $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>';

    Instead of replacing, you can comment the code by adding // at the beginning of the code. For e.g.:

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

12. mihirx
    Member
    Posted 1 year ago #

    I thot I wud help newbies like me by specifying exactly wht to replace wid wht, I was about to mess up.

13. BrisBenjamin
    Member
    Posted 12 months ago #

    I've been using the default value as a work around to get the field label to appear in the text field to save space. I've now got it clearing when clicked.
    My issues is now that these fields are required by if people just click send the default value get used. Is there a way around this?

    http://1.debtmediators.com.au

Topic Closed

This topic has been closed to new replies.