Create clickable URLS from mysql php result on same page?

MYSQL results from php turn into unique link

[cyberion1985]

I have a search page, that returns mysql query like so :

while($row=mysqli_fetch_array($result))
{
echo "<a onclick='function1();function2();function3()'>",$row['compn'],"</a>";
echo "<form><input type='text' id='tester' value='",$row['compuid'],"' hidden='hidden'></input></form>";
}

Nothing on my page opens a new page or loads a new one. Everything basically resides on the same page. The results are displayed in another overlay :

<a onclick="function1();function2();function3()"></a>
<form><input id="tester" type="text" hidden="hidden" value="abcdefg"></input></form>

<a onclick="function1();function2();function3()"></a>
<form><input id="tester" type="text" hidden="hidden" value="mnopqrs"></input></form>

As you can see above, it kind of works BUT not like I want it to be :
If clicked on the top "link", it will load

id="tester"

into

document.getElementById("tester").value;

and then display abcdefg. If I click on the bottom link, it will again load tester and display abcdefg. HOW do I get the code or the php to load a dynamic attribute or something, so that if I click the below link, it will actually display mnopqrs ?

Note: When a result link is clicked, it should display more details on an overlay by reading off from the php. For example :

link 1 = Peter, LAW
link 2 = Kate, JOURNALISM

(click on link 1:)
Peter, BIO : Peter has been studying LAW for more than 2 years,
Peter was born on 24/05/1992. Picture of Peter


(click on link 2:)
Kate, BIO : Kate has been studying ...

[penders]

Your problem would seem to be that you have more than one element with the same ID ie. "tester" (this is invalid HTML). When you

getElementById("tester")

you are (probably) always going to get the first element with this ID ie. "abcdefg" in your example.

When you generate your HTML from PHP you should be outputting "tester1", "tester2", etc. (or something like that.) You can assign a similar/corresponding ID to your links eg. "link-1", "link-2", etc. so you can easily work out which "testerN" to lookup.

Aside:

You should really be assigning event listeners using DOM methods, rather than in the HTML onclick attribute directly. When you call functions from the onclick attribute they are simply called in the global scope - there is no event object - you don't know on which element the event occurred.

Also, INPUT elements do not have a closing tag. And INPUT elements don't need to be enclosed in a FORM, unless this is being submitted (or maybe you don't have any other container?).