click link > new page > propagate input element

We have links on particular pages, that are served dynamically.

So lets say we are on a page about apples.

One of our links could be , search for apples.

So very basically.

<a href="goto.php?q=apples">Search for Apples</a>

And on the goto.php page, we actually have a ajax search field, that as user types it pings our db using ajax, and displays results below.

Its input field is :

<input name="suburbs"  autocomplete="off" class="suburbsreviews" type="text" id="terms" size="50" onkeyup="getScriptPage('show_results','terms','1')" onblur="if ( this.value == '' ) this.value = this.defaultValue" onfocus="if ( this.value == this.defaultValue ) this.value = ''" value="type your search term" />

Essentially, what I want to do, is read the incoming link search term , in this case apples, and ADD it into the input field. So that on page load, the input field contains the word apples ..

My concern is that input field works using ajax, and firing requests onkeyup, so just adding the word apples as a value to the input box, isnt really gonan work >

Or is it ?

I dont think so, so wondered if anyone knows of a way we could initiate this to work, so that the input element contains the referring pages search word, and fires the ajax request so that the results are displayed below it...

The ajax page w开发者_如何转开发orks fully, if we TYPE the word, because it listens to the keyup event, but wondered if there was a workaround...

Cheers Ste

Did you try triggering the keyup event on page load if that text box has a value ?

if( $('#yourinput').val() !== '' )
    $('#yourinput').trigger('keyup')

P.S i don't really like this solution.

You can fire the keyup on page load, if the field is not empty As you have no jquery, let's do it in plain javascript.

This should be in your body onload:

var val = document.getElementById('terms').value;
if(val.length > 0 && val != 'placeholder'){
    getScriptPage('show_results','terms','1');
}

Put the search term as the value of the <input>, and dd a piece of Javascript to goto.php that calls the keyup handler once (if the input field isn't empty) when the page loads.

See these sites to actually get the URL parameters:

Using JS and/or jQuery

Using JS and Regular Expressions

Now insert the value into the input field:

var searchTerm = 'mySearchTerm';  // see above to get the search term from the url
$("input[name='suburbs']").val(searchTerm);

Now just call the function that does the autocomplete. Put together, it looks like this:

var searchTerm = 'mySearchTerm';  // see above to get the search term from the url
$("input[name='suburbs']").val(searchTerm);
getScriptPage('show_results','terms','1');