Problem arising from 'How to create a filter/search list'.

[Rickccc]

I have used the guidance at https://www.w3schools.com/howto/howto_js_filter_lists.asp

to create a filter/search list.

When text is typed into the search box, only the filtered items are shown on screen, as expected.

But if, for example, the list contains both ‘Charlie’ and ‘Charles’, and if the user filters for ‘Charlie’, hyperlinking ‘Charlie’ to ‘Charles’ does not work, e.g.

Charlie, see <a href=”#Charles”>Charles.</a>

...

<a name=”Charles”>Charles</a> ...

P

erhaps this is because the href tag at this point is only searching the filtered results.

Hyperlinks from one item to another like this do work BEFORE the list is filtered, but not AFTER the list has been filtered. Any ideas how to resolve this, please?

[dsonesuk]

The hash only, in href does not do anything but stay on current page. Javascript filters the inner text name only and if you are using html5,  id ref is used instead of name attribute, so try that instead.

[Rickccc]

Thanks, dsonesuk, but using 'id' instead of 'name' doesn't seem to make any difference. I've uploaded a file, in which you'll a list of names, starting

Adam

Billy, see Wiiliam

...

If you click on William (on the same line as Billy) you'll be taken to William below. But if you type Billy into the box above and filter to Billy, when you then click on William, nothing happens; the target William seems to hidden to the code.

Would appreciate any help you can give.

filterTrialStyle.css filterTrial.html

[Rickccc]

The answer to this conundrum was that the page had to be reloaded before linking to an item that was not on the filtered list could be found, so the coding for the example 'see William' link above should be:

see <a href="#William" onclick="window.location.reload()">Willam </a>