By ss_drupal on

I'm baffled and seeking suggestions.

I want to replace the unsightly search form submit button with a graphic. In theory it seems simple enough, override the theme function, tweek the form values and it ought to be fine. Except I can't get it to work.

Consider the code from my theme's template.php:

  function mythemename_search_block_form($form) {

	$form['submit']['#type'] = 'image';
	$form['submit']['#src'] = '/images/search.png';
	$form['submit']['#value'] = 'TEST STRING 1';
	$form['submit']['#title'] = 'TEST STRING 2';
	// $form['submit']['#name'] = 'submit';

	return drupal_render($form);
  }

If I comment out the line $form['submit']['#type'] = 'image'; the button renders correctly displaying the string "TEST STRING 1".

When I don't comment that line out it just disappears, the image "/images/search.png" never shows up.

When I inspect the objects in question with instructions like print_r('src= '.$form['submit']['#src'].'<br>');, everything seems to be correct.

When I probe using theme_devel everything looks fine.

Except it doesn't work.

All I'm looking to achieve is a submit input that looks like <INPUT TYPE=image SRC="/images/search.png">.

I must be missing something painfully obvious but I running out of ideas and places to look.

Anybody have a clue?

Thanks for reading.

⋅ Categories: Drupal 6.x

Comments

nevets’s picture

nevets commented

If inspect the generate html (firebug a Firefox extension is useful for this) what do you see? Do you have a folder under your sites root directory called 'images'?

ss_drupal’s picture

ss_drupal commented

If I go into the input tag through firebug and using the time honored brute force method change the type to "image" and the src to "/images/search.png" I get exactly what I want.

Just to make sure I've not lost it completely I just tested that again. Works like a champ.

While we're on the subject I just also tried:

unset($form['submit']);
$form['image'] = array('#type' => 'image', '#src' => '/images/search.png', '#id' => 'edit-submit', '#class' => 'form-submit' );

No go.

I can't think what I'm missing.

It must be really obvious!

ss_drupal’s picture

ss_drupal commented

OK, I found the magic.

After, I might add, extensive scouring of the drupal.org site from both the drupal search function and google.

BTW the documentation turned up at:

forms_api_reference.html
http://api.drupal.org/api/drupal/developer--topics--forms_api_reference.html/6

(I'm on Drupal 6.)

Just for the record, for those who may pass this way after me ...

The fix turned out to be:

function mythemename_search_block_form($form) {
	unset($form['submit']);
	$form['image_button'] = array('#type' => 'image_button', '#src' => 'images/search.png');
	return drupal_render($form);
}

NOTE: Apparently the forms API doesn't like type='image' of standard HTML. It wants to see type='image_button'. I couldn't even begin to guess why. It made sense to somebody at some point for some reason. Conformance to standard practice clearly wasn't the top priority. Maybe type='image' has reserved-word magical powers deep in the drupal core somewhere.

NOTE: Notice the lack of the leading slash in the path. I am trying to hit a directory right off my site root. Apparently setting the #src member auto-magically adds a slash for you somewhere under the covers. Bug? Feature? Obscurely documented or undocumented function? Who knows. I only know what testing has demonstrated. That syntax fetched out the image ... site-root/images/search.png

Anyway, this got me my image.

The form appears to work normally.

====================================

I don't mean to sound unpleasant but someday somebody needs to do a permuted index of the drupal online literature.

All honor to the good souls that do the heavy lifting at drupal.

But considering what the world is doing with searching and taxonomy, someday those techniques ought to be applied to drupal itself.

Perhaps if I ever find an opportunity I'll give it a try myself.

goingbeyond’s picture

goingbeyond commented

Awesome. Thanks for the documentation.

ellanylea’s picture

ellanylea commented

For future reference, this thread is neatly summarized in the top part of this Handbook page:

How to Customize the Block Search Form - http://drupal.org/node/154137