up vote 1 down vote favorite

I was wondering if some jQuery expert would be so kind to convert the below script to jQuery. I am having trouble converting it myself and would much prefer to use a jQuery equivalent.

What I am trying to do is simply remove the default value of 'Search' from a keyword field onSubmit, as the user can leave the keyword field blank.

function clearValue() {
    var searchValue = document.getElementById("global-search").value;
    if (searchValue == "Search") {
        document.getElementById("global-search").value = "";
    }
}

Any help would be much appreciate.

share|improve this question
100% accept rate
Wow... that was quick. Thanks guys! – Palle Feb 8 at 1:03
What happens if I want to search for the word Search ? – Stephen P Feb 8 at 1:05
1  
That is a good point... it may be a silly idea to disallow that keyword. I am stuggling to make this form fool proof, and may decide to absolutley position the input labal instead of using a default value. – Palle Feb 8 at 1:52
You could consider Placeholder Text and fall back to label positioning if necessary, or simply don't do the placeholder for browsers that don't support it. – Stephen P Feb 8 at 20:59
feedback

3 Answers

up vote 3 down vote accepted 
//wait for the DOM to be ready (basically make sure the form is available)
$(function () {

    //bind a `submit` event handler to all `form` elements
    //you can specify an ID with `#some-id` or a class with `.some-class` if you want to only bind to a/some form(s)
    $('form').on('submit', function () {

        //cache the `#global-search` element
        var $search = $('#global-search');

        //see if the `#global-search` element's value is equal to 'Search', if so then set it to a blank string
        if ($search.val() == 'Search') {
            $search.val('');
        }
    });
});

Note that .on() is new in jQuery 1.7 and in this case is the same as .bind().

Here is the documentation related to this answer:

share|improve this answer
A useful comparison of event handlers in jQuery elijahmanor.com/2012/02/… – David Clarke Feb 8 at 1:08
1  
I only skimmed the post but it looked to be good information. Don't use .live() though. It's depreciated as of jQuery 1.7 and it's functionality is the same as using .delegate(). – Jasper Feb 8 at 1:16
Yes, that's mentioned as one of the cons for .live() :) – David Clarke Feb 8 at 1:20
feedback
up vote 0 down vote 
function clearValue() {
    if ($("#global-search").val() == "Search") {
        $("#global-search").val('');
    }
}
share|improve this answer
feedback
up vote 0 down vote 
if($("#global-search").val() == "Search")
    $("#global-search").val("");
share|improve this answer
feedback

Your Answer

 
or
required, but never shown
discard

By posting your answer, you agree to the privacy policy and terms of service.

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