toggle text input value and search

Question

Hi I'm having problems with toggling/searching with my text input, here is a function which I use:

function toggleSearch(obj) {
       var el = document.getElementById(obj);
       el.value = (el.value != '' ? '' : 'Search' );
      }

I call this function in focus/blur of text input and it works like a charm when I'm submitting my form by pressing the return key, but it doesn't work when I click the button search naturally because I'm invoking this function to fire on blur.

How can I modify this function in order to work for both cases when I press return on the input and also when I click the search button? Thank you

Answer 1

The simplest way would be to check for the exact phrase "Search" before clearing the text, and then checking for an empty box before putting Search back in again. For example:

if (el.value == 'Search') {
    el.value = '';
}
else if (el.value == '') {
    el.value = 'Search';
}

Answer 2

You could always call toggleSearch as the onclick call for the submit button too.