CODEWITHSUNDEEP
javascriptphphtml
Gabrie
Gabrie

Reputation: 579

How to make search result clickable as if clicking a button

I have a html page with a form and input fields. When a user enters text into the input field, at each key a database is searched for corresponding values. This is done through a Javascript call which then does an XMLHttpRequest to a PHP script. In the PHP I return a top 10 list of matches. This list is then shown on the html page.

What I now would like is to make each item in the list clickable and when clicked it should fill the form field with the value. I can make the results linkable by adding <a href> around them, but the onClick doesn't seem to work for it.

Html/PHP page with form:

<form action="index.php?page=n0402" method="post" Name="AddPolish" >
    <div id="frmBrandInput">
        <label for="frmBrand">Brand name:</label>
        <input type="text" name="frmBrand" size="50" onkeyup="n0401CheckRecords(1);" onchange="n0401AddResults_Clear();" maxlength="100" id="frmBrand"   />
    </div>
    <div id="ListResults">
        <ul style="list-style-type:none;">
            <div class="n0401AddResults" id="n0401AddResults_Status">
            </div>
        </ul>
    </div>

    <button type="submit" name="submit" value="submit-value">ADD</button>
</form>

The javascript calls the PHP and changes the n0401AddResults_Status:

function n0401CheckRecords( jsCheck){
---- xmlhttp request code and return snipped out --- 
document.getElementById("n0401AddResults_Status").innerHTML = return_data;
}

The PHP page that checks the database:

While ($dbCheck_result = mysqli_fetch_row($result))
{
echo "<li class='CheckListItem' onClick='ClickMe();'><a href='".$dbCheck_result[1]."'>".$dbCheck_result[1] ."</a></li>";
}

What is the best way to structure that return string to make it clickable? Btw, I'm now using a list for it, but that is not a requirement to me.

Btw I'm NOT using JQuery.

Upvotes: 0

Views: 2045

Answers (1)

Gabrie
Gabrie

Reputation: 579

I should have used the # for <a href>. Solution was to use this line:

echo "<li class='CheckListItem' onClick='ClickMe(\"".$dbCheck_result[1]."\");'><a href='#'>".$dbCheck_result[1] ."</a></li>";

Upvotes: 2

Related Questions