Add onClick attribute to login form textfield?

By Fiasst on 26 Apr 2007 at 17:31 UTC

Hello,

I'm trying to add onClick and onBlur attributes to my Login form input textfields. I have no idea how to achieve this but I found '#attributes' => array( shown in the below code. It's probably not the way to do it and I'd really appreciate some help!

Thanks.

function user_login_block() {
  $form = array(
    '#action' => url($_GET['q'], drupal_get_destination()),
    '#id' => 'user-login-form',
    '#base' => 'user_login',
  );
  $form['name'] = array('#type' => 'textfield',
    '#title' => t('Username'),
    '#maxlength' => USERNAME_MAX_LENGTH,
    '#size' => 15,
	'#value' => t('Username'),
    '#required' => TRUE,
	'#attributes' => array(
    	'onblur' => 'clickclear(this, 'Username')',
    	'onclick' => 'clickrecall(this, 'Username')'),
  );

Comments

Ah, Just as I posted this I

Fiasst commented 26 April 2007 at 17:41

Ah, Just as I posted this I found my way! BUT, by using " " in the code below, viewing the page source I get:
onblur="clickrecall(this, "Username")" onclick="clickclear(this, "Username")"

Question: How do you use quote marks with php when already inside quote marks? in Javascript I beleive you add a forward slash like: 'clickrecall(this, /'Username/';)'

Thanks!

The code so far:

function user_login_block() {
  $form = array(
    '#action' => url($_GET['q'], drupal_get_destination()),
    '#id' => 'user-login-form',
    '#base' => 'user_login',
  );
  $form['name'] = array('#type' => 'textfield',
    '#title' => t('Username'),
    '#maxlength' => USERNAME_MAX_LENGTH,
    '#size' => 15,
    '#required' => TRUE,
	'#attributes' => array(
    	'onblur' => 'clickrecall(this, "Username")',
    	'onclick' => 'clickclear(this, "Username")'),
	'#value' => t('Username'),
  );
  $form['pass'] = array('#type' => 'password',
    '#title' => t('Password'),
    '#maxlength' => 60,
    '#size' => 15,
	'#attributes' => array(
    	'onblur' => 'clickrecall(this, "Password")',
    	'onclick' => 'clickclear(this, "Password")'),
	'#value' => t('Password'),
    '#required' => TRUE,
  );

Use double quotes

drbutts commented 10 August 2007 at 20:26

Just had this problem and figured it out.

Use 'onclick' => "clickclear(this, 'Username')"

Note the reversal where single quotes are double quotes, and vice versa.

Not able to set password default value

SonamSdiwate commented 1 December 2010 at 05:22

hi,
It works but not able to set password default value

No solution?

ideveloper commented 27 July 2007 at 12:19

Has anyone found a solution for that? I've got the same problem and I can't figure out how to solve it..

create a variable

BobbyG123 commented 26 October 2007 at 13:00

A simple solution that worked for me, is to create a variable to hold the offending '' part of the js
e.g

////////////////////////////
//var to get around '' issue
		$div1= "'div1'";

  'onclick' => 'showMe('.$div1.', this)'),

You could even put the whole js onclick string into the variable.

hook_form_alter or jquery

jswaby commented 27 July 2007 at 13:58

your 2 options are to either build a simple module that implements hook_form_alter and add it in:

http://api.drupal.org/api/HEAD/function/hook_form_alter

or if you're using drupal 5, do a jquery equivalent to what you want to do.

======
Jason

Alternate solution

jdrichmond commented 27 November 2007 at 16:00

Mistaken post.

Alternate solution

jdrichmond commented 27 November 2007 at 14:58

I tried some of the solutions for adding javascript into the #attributes with no success. I tried an alternative solution by adding the javascript to #prefix like the following, but it didn't work either.

$form['test'] = array(
'#type' => 'button',
'#value' => t('Test'),
'#prefix' => '

function test() { alert("test"); }

',
'#attributes' => array('onclick' => 'javascript: test();'),
);

This worked to an extent... It will display the javascript correctly without changing the quotes to html, but will not work for a redirect. The form gets re-render so if the data does not validate than the user is brought back to the form. If you don't want the user to leave the form without filling out the form fields than this is a acceptable solution. In order to get a redirect working I had to create a button outside of the form using the markup type.

$form['previous'] = array(
'#prefix' => '',
'#value' => '',
'#suffix' => '',
);

Alternate solution continued

jdrichmond commented 27 November 2007 at 16:02

Not sure what the security implications are for this alternative so use at your own risk.

text module issue

kenorb commented 22 May 2009 at 16:32

If you using text module for that (CCK), check this issue:
#470260: #attributes are not properly rendered

Good, it works

javilete commented 27 October 2009 at 19:34

Hi, I have been taking a look and searching some information about how to add events in a field of a form. Everything is done fine but I dont know how to add the function. For example, in the last post, where do you have the function "clickrecall()"?
Thanks a lot in advance.

any fix to this?

getstarted commented 26 January 2010 at 05:09

I tried all the suggestions posted here, but none worked. Always rendering as &, etc., to the page. Thanks,

?

b.tomi commented 27 February 2010 at 16:42

    '#default_value' => t('Username'),
    '#attributes' => array(
        'onblur' => 'this.value="Username"',
        'onclick' => 'this.value=""'),

Similar

jsims281 commented 3 August 2010 at 13:54

I arrived at a similar solution when working on a search block form:

    $form['search_block_form']['#attributes'] = array(
      'onfocus' => "if (this.value == 'Enter Search') {this.value = '';}",
      'onblur' => "if (this.value == '') {this.value = 'Enter Search';}"
    );

Works perfectly fine

vyasamit2007 commented 6 March 2014 at 14:44

This works perfectly fine for me.

Thank you for this resolution.