"Search This Page" code

[ephayzee]

Hey Everybdoy,

Trying to figure this out. I have a page on my website that lists alot of manufacturer information like their products, names, keywords, etc.

I have it set up so the customer can click on a letter of the alphabet and is then directed down to the anchor point. This works fine but sometimes I get the occasional email asking why this certain mfr is not listed but it is, just that the customer did not want to look for it, which is why I want to do this:

I want to add a search field to this page (only on this page) where the customer would type in what he/she is looking for and once they hit search, automtically is taken down to the match. It sort of is like using anchor points, but its not.

A search results page is not what I am looking to do. It would be similar to the "Find on this page..." option you have under Edit on your web browser.

Is this even possible?

Thanks,

Franco

[Jon Hanlon]

You could do it using scrollIntoView, but I don't know how you're going to 'search' for it.

[ephayzee]

So there is no possible way to do what I am trying to do?

[waffles]

I've told people to use CTRL F before, but that's the closest I've ever seen that didn't involve search results pages or anything like that.

[Jon Hanlon]

OK, so let's say your page has sodas on it:

<div id='pepsi'>...</div>
<div id='cocacola'>...</div>
<div id='drpepper'>...</div>
<div id='sevenup'>...</div>

We can 'go to' an element using document.getElementById('pepsi').scrollIntoView()
Works fine if the user enters 'pepsi' in the find box.
[Of course we'd be saying document.getElementById(document.getElementById('findBox').value).scrollIntoView() ]

but let's say they input 'Pepsi' (javascript is case-sensitive), or 'pepsico' or 'pepsicola' , 'pepsi-cola', 'coke', '7up' etc. etc. etc. Then you need some logic to match the input field with what's typed:

var target = "", targetDiv = "";
if (findBox.value.toLowerCase().substr(0,4) == "peps") target = 'pepsi';
if (findBox.value.toLowerCase()) == "doctorpepper") target='drpepper';
if (findBox.value.toLowerCase().substr(0,2) == "dr") target = 'drpepper';
if (...) etc;
if (target > "") targetDiv = getElementById("target");
if (targetDiv) targetDiv.scrollIntoView();

It's a whole lot easier suggesting the user does control-F.