在中选择特定行 <select> SQL查询返回后的列表

Question

I have this rather tricky problem to solve whereby I have used the following to display a list of named shops with ID number for selection from a drop down list when creating a new employee record. This works well at this point. A piece of javascript splits the displayed text from the the user selection and sends the shop ID number off with the new employee details to be inserted into the employee table in the database. I am using a hidden shopID text box to store the number as can be seen in the javascript.

Here is the code PHP first then javascript:

$result = mysqli_query($link,"SELECT shopID, shopName FROM SHOP");
            echo "<br><select class='formInput' name='listbox' id='listbox' onchange='captureShopID()' tabindex=9>";
            #Use onchange instead of onclick where Keyboard is used. onclick does not register changes fro keyboard
            while($row = mysqli_fetch_array($result))
            {
                $shopID = $row['shopID'];
                $shopName = $row['shopName'];
                $allText = "$shopID, $shopName";
                echo "<option value='$allText'>S00$shopID  $shopName</option>";
            }
            echo "</select>";

AND (including this, because it may contain hints to a solution for my problem)

<script>
function captureShopID()
{
  var sel = document.getElementById("listbox");
  var result;
  result = sel.options[sel.selectedIndex].value;
  var shopNumber = result.split(',');
  document.getElementById("shopID").value = shopNumber[0];
}
</script>

OK. So all good so far. What I am trying to do is use the same set up for amendments to the same record. So the update layout is similar to the one for creating the record. I have the list element again but what I would like is to have it showing the shop that the employee works at otherwise it is confusing as the list defaults to the first item in the list, in most cases not the actual shop that the employee works in.

So, instead of:

S001 London

Maybe it should be:

S003 Paris… Where the employee works.

I have tried various things but it is a tricky one. The fact that there is the option value concatenation of $shopID and $shopName may be complicating things a bit in my quest for a solution.

Pretty new to PHP and javascript (javascript pretty mysterious) and programming as a whole. Learning quickly but suffer many days of brain cell overload.

Any pointers in the right direction appreciated.

Answer 1

My Solution… After some outside the box tangental thinking working on some other aspects of my project.

<?php
            include "../db.php";

            $result = mysqli_query($link,"SELECT shopID, shopName FROM SHOP");
            echo "<br><select class='formInput' name='listbox' id='listbox' onchange='captureShopID()' tabindex=9>";
            #Use onchange instead of onclick where Keyboard is used. onclick does not register changes from keyboard
            echo '<option>Works at:'.$shopName.'</option>';
            while($row = mysqli_fetch_array($result))
            {
                $shopID = $row['shopID'];
                $shopName = $row['shopName'];
                $allText = "$shopID, $shopName";
                echo "<option value='$allText'>S00$shopID  $shopName</option>";
            }
            echo "</select>";
        ?>

I achieved what I wanted by adding the extra to the top of the list outside the loop to act as the default item listed:

echo 'Works at:'.$shopName.'';

This has the result of presenting the update employee record so that shop from their record is what you see in the menu like so:

Works at: London Southwark

And the list pops up to show the other shop options

Works at: London Southwark
S001 DISTRIBUTION CENTRAL Paris
S002 Paris Montmartre
S003 London Southwark
S004 Roma Trastevere

and so on.

Not exactly what I initially intended but just as good

I am aiming for a clean and spasre interface without too many labels and this solution makes the list element self explanatory.

If any one has a good suggestion for the thread title please post as this one is quite useful.