1

I can't seem to figure out how to get rid of the default text "search" on my search form (located here: http://dev.mysourcewise.com/media-center)

I can confirm the following works in Chrome's console:

jQuery("#edit-search-block-form--2").val("");

However, when I try adding it using Drupal.behaviors or even with the following code in my theme's template.php file, it doesn't work (even though I can confirm the javascript is loaded in the footer):

  drupal_add_js('jQuery(document).ready(function () { jQuery("#edit-search-block-form--2").val("");',
array('type' => 'inline', 'scope' => 'footer', 'weight' => 1000)
 );

I have tried other methods as well, and nothing is working except entering the the above in the browser console.

  • I pointed out in one of the answers that no .tpl.php approach would work because this was being set with a script. Thanks to all of you who answered. – Webdrips Jul 20 '17 at 21:45
  • I'm still scratching my head as to why my JS didn't override the one from the module. Thoughts on that would be great. – Webdrips Jul 20 '17 at 21:55
4
+50

The Search text in input is created by jQuery from any where. When I search through the JavaScript files, I find the following file:

file : /sites/default/modules/hg/sw_tweaks/js/sw_tweaks.js

The code

//Search Bar @ Top of Home Page
    $(function () {
      $('#edit-search-block-form--2').val("search");
    });
    jQuery('#edit-search-block-form--2').click(function () {
      jQuery('#edit-search-block-form--2').val('');
    });

Try to remove this code. I hope this helps you or help you finding the problem.

| improve this answer | |
  • Yes this was indeed the correct answer; thank you for finding what I couldn't using grep (because I was looking in sites/all/themes). Still not sure why this code took precedence over the code I posted above. – Webdrips Jul 20 '17 at 21:43
3

A good way to do this is to trigger the search form is inside your template.php file located at the root of your theme. In this file you must implement hook_form_FORM_ID_alter().

Like this:

function YOURTHEMENAME_form_search_block_form_alter(&$form, &$form_state, $form_id) {
  $form['search_block_form']['#title'] = t('Something'); // Change the text on the label element 
}

It is also possible to make the submit button as an image like this:

function YOURTHEMENAME_form_search_block_form_alter(&$form, &$form_state, $form_id) {
  $form['search_block_form']['actions']['submit']['#type'] = 'image_button';
  $form['search_block_form']['actions']['submit']['#src'] = 'path/to/image';
}

Drupal API

Note: Always when you are implementing hooks you need to clear the cache.

| improve this answer | |
1

It seems that the default placeholder text is set using javascript (probably from the parent theme). This can be easily checked by disabling javascript and loading the demo page again.

A dirty way to deal with ypur problem:

drupal_add_js('jQuery(window).
  load(function(){ 
    jQuery("#edit-search-block-form--2").val("");
  });',
  array('type' => 'inline', 'scope' => 'footer', 'weight' => 1000)
);

This will use the window.load event, that will - hopefully - run your code snippet after the theme's javascripts.

Good luck!

P.S.: Of course, the best way to go about this would be to check how the theme's javascripts work and figure out if there is some attribute (probably the title one) that is used to set the value of the placeholder.

| improve this answer | |
  • This was the only other solution that looked promising. Because the other answer actually found the source of the issue, I had to give him the bounty, but I'll give your answer an upvote. – Webdrips Jul 20 '17 at 21:47
0

Rather than using jquery to replace the text better use hook_form_alter.

function YOURTHEME_form_search_block_form_alter(&$form, &$form_state, $form_id) {
    $form['search_block_form']['#title'] = t('Text you want'); // Change the text on the label element 
}
| improve this answer | |
  • I should have mentioned I already tried that (using $form['search_block_form']['#title'] = t('');). I believe the parent theme is setting this somewhere with a script, but I haven't been able to locate it. – Webdrips Jul 6 '17 at 8:24
  • Try using "hook_module_implement_alter" to make sure your hook get invoked after the base theme. – nit3ch Jul 6 '17 at 9:00
  • I have never tried that function before. It might be helpful if you can update your answer to reflect that suggestion. If this is set at the JS level, it wouldn't matter, would it? (Note that I can't find "search" in the HTML, leading me to believe it's being set with JS.) – Webdrips Jul 6 '17 at 9:16
0

An alternative to altering the template variables is to override the template file.

Switch on template debug to see what template is used in the HTML comments.

Copy that template to your theme folder and change whatever you like.

To tell Drupal about the new template, you must execute drush cr.

| improve this answer | |
0

Use THEMENAME_form_alter() in sites/all/themes/THEME/template.php. Place this code in this file.

function THEMENAME_form_alter(array &$form, array &$form_state = array(), $form_id = NULL) {
    if ($form_id) {
        switch ($form_id) {
            case 'search_block_form':
                $form['search_block_form']['#attributes']['placeholder'] = t('Search');
        }
    }

Obviously, THEMENAME word will be replaced name of theme you use. After placing this code please clear cache.

| improve this answer | |
0

Combining previous answers:

-use the hook form alter (looking at the site, it is indeed the search-block-form), as Jonathan Dalgaard suggested.

-set the 'placeholder' attribute, as usmanjutt84 suggested.

function THEMENAME_form_search_block_form_alter(&$form, &$form_state, $form_id) {
  $form['search_block_form']['#attributes']['placeholder'] = t('Enter search term');
}
| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.