Default text in form

I would like to change my login form.

I'd like to include default text for the ID text input that says "Username or Email"

and for Password of course "Password".

I can use this:

$(function(){ $('#ID').click(function(){ $(this).val('').unbind('click');});});

And this:

$(function(){ $('#Password').click(function(){ $(this).val('').unbind('click');});});

To clear the box when they click it.

I just cannot get the form to place default values in the text box.

Any help?  Thanks!

The easiest will probably be to use javascript/jquery to change the default value of the form field after it is loaded.

It can be easily done. The forms do not contain a ID, so the jquery reference to #ID and #Password will not work of course but can be changed to use the field names instead.

However. One thing you may not be aware of. The password field is of type password which means when you set the starting value to "Password" you will not see the word "Password" but rather 8 dots instead.

You could change the password type to text, but you can't change the type back to password to get the dots back after the field is cleared because jquery forbids it. This is because IE does not support changing of types on input fields using javascript.

So even tho you can do it, it most likley will not be the result your after.

Well, two out of three is not bad

Thanks for pointing that out!  The password field doesn't have to display anything, just the username.

On an iPhone, the screen is quite crowded and having "Enter your name or email"  makes it look too ugly.

I just shortened it to Username or Email and it looks ok.

I would like to know how to incorporate that in the form tho.  Maybe use it for other uses.  :)

A quick search found this: http://www.electrictoolbox.com/jquery-get-set-form-values/

Really simple.

Edit inc/design.inc.php

Look for this

            'nickname' => array(
                'type' => 'text',
                'name' => 'ID',
                'caption' => _t('_NickName'),
            ),


Add a value line like so.

            'nickname' => array(
                'type' => 'text',
                'name' => 'ID',
                'value' => 'Enter your name or email',
                'caption' => _t('_NickName'),
            ),


That presets the nickname field.

Now to add the javascript that will clear it on click.

Same file a little further down look for this.

    $sCustomHtmlBefore = '';

Change it to this.

    $sCustomHtmlBefore = <<<CODE
<script>
$(function(){ $("[name='ID']").click(function(){ $(this).val('').unbind('click');});});
</script>
CODE;


That's it.

As Always, Deano's the genius!

Sorry for digging  this one up but the idea is going in my direction. I was wondering if this could be applied to the join form? I would love to get rid of those captions on the left side of the form and have placeholders in the input instead.  

Thanks