title: Clear default search text on submit
body: <p>I have the following code to put helper text in a search input box that is removed when you click in the box and returned if you click anywhere else without changing it:</p>
  
  <pre><code>$('#search-form input[type="text"]').each(function(){
      var defaultVal = 'Category Search';
      $(this).focus(function(){
        if ($(this).val() == defaultVal){
          $(this).removeClass('active').val('').css('color', '#000');;
        }
      })
      .blur(function(){
        if ($(this).val() == ''){
          $(this).addClass('active').val(defaultVal).css('color', '#CCC');
        }
      })
      .blur().addClass('active');
  });
  </code></pre>
  
  <p>But if the user clicks submit without clicking in the input box, the site will search for the helper value (Category Search).</p>
  
  <p>What I need to do is on submit check the value and if it's <code>Category Search</code> then do the following things:</p>
  
  <ul>
  <li>Change helper text to <code>Please enter a category</code></li>
  <li>Don't submit the form.</li>
  </ul>
  
  <p>I tried this but it stopped my default value (Category Search) from working all together:</p>
  
  <pre><code>$('#search-form input[type="submit"]').click(function() {
      if ($(this).val() == "Category Search")
          //do stuff here
  });​
  </code></pre>