PHP Dropdown Menu from DB column values

Question

WHAT I STARTED WITH

My php

<?php

mysql_select_db("$db") or die(mysql_error());

$sql = "SELECT kpi FROM pin_kpi_types";
$query = mysql_query($sql);

echo '<select name="KPI" style="width: 400px">';
while ($row = mysql_fetch_assoc($query)) {
    echo '<option>'.$row['KPI'].'</option>';
}
echo '</select>';

?>

My current label/input method that requires me to manually type.

What I am trying to do is pull a query from a table to select the only available KPI types.

This is working now.

<p>
  <label for="KPIType" id="preinput">Choose KPI Type: </label>
  <input type="text" name="kpi_type" required placeholder="Lead" id="inputid" />
</p>

---

WHERE I WAS AT PREVIOUS

---

Edit; Unfortunately the answer posted by Lucky didn't quiet help me, but it steered me in the right way.

I am now have duplicate fields? It isn't posting the value into the DB. either.

Here is a screenshot...

http://s30.postimg.org/o1c2l9yr5/Untitled.png

Can someone steer me in right direction of where I went wrong? :)

Thank you in advance for any help.

<?php
    include('db.php');
        $select=mysql_query("SELECT * FROM pin_kpi_types");
        $i=1;

    while( $userrow=mysql_fetch_array($select) )
        {
        $kpi_id     =$userrow['KPI_ID'];
        $kpi        =$userrow['KPI'];
?>
<style>
#CreateStatusTypeFORM label {display: inline-block;width: 10em; text-align: right;padding-right: 0.5em;}
</style>

    <div id="CreateStatusTypeFORM">
    <form action="insert.php" method="post" name="insertform">
<p>
  <div align='center'><label for="StatusColor" id="preinput">Choose A Color: </label>
    <ui-colorpicker ng-model="targetColor"></ui-colorpicker></div>
  <input type="hidden" name="pinstatus_color" value="{{targetColor}}" id="inputid" />
</p>    
<p>
  <label for="StatusName" id="preinput">Set Status Name: </label>
  <input type="text" name="pinstatus_type" required placeholder="Come Back" id="inputid"/>
</p>
<p>
  <label for="StatusName" id="preinput">Available KPI Types: </label>
   <select name="<?php echo $kpi; ?>" style="width: 237px">
    <option name="KPI" required id="inputid" value="<?php echo $kpi; ?>"><?php echo $kpi; ?></option>
  </select>
</p>
<?php } ?>
  <input type="submit" name="send" value="Submit" id="inputid1"  />
</p>
</form>

---

WHERE I AM AT NOW

---

This is where I am at. I now can get the dropdown correct without duping it over and over. However, now I cannot get the value to post the actual selected KPI to the DB. everything else submits data to the db, but KPI_type option.

<style>
.StatusForm {padding-left:75px;}
.CreateStatusTypeFORM {padding:25px;border-style:solid; border-color:solid black; width: 500px;background-color:#C4C4C4;}
#CreateStatusTypeFORM label {display: inline-block;width: 100em;}
#CreateStatusTypeFORM input {border-color:solid black;}
#CreateStatusTypeFORM input[type=text] {padding:5px; border:1px solid #666; -webkit-border-radius: 5px; border-radius: 5px;}
</style>
<div class='StatusForm'>
    <div class="CreateStatusTypeFORM">
    <H3> ADD New Status </H3>
    <form action="insert.php" method="post" name="insertform">
<p>
  <label for="StatusColor" id="preinput">Choose A Color: </label>
    <ui-colorpicker ng-model="targetColor"></ui-colorpicker>
  <input type="hidden" name="pinstatus_color" value="{{targetColor}}" id="inputid" required placeholder=""/>
</p>    
<p>
  <label  for="StatusName" id="preinput">Set Status Name: </label>
  <input type="text" name="pinstatus_type" required placeholder="" id="inputid"/>
</p>
<p>
  <label for="KPI" id="preinput">Available KPI Types: </label>
   <select>
    <?php
    include('db.php');
        $select2=mysql_query("SELECT * FROM pin_kpi_types ORDER BY KPI_ID DESC");

    while( $userrow=mysql_fetch_array($select2) )
        {
        $kpi            =$userrow['KPI'];
        $kpi_id         =$userrow['KPI_ID'];        

?>
<option name="kpi_type" required id="inputid" value="<?php echo $kpi; ?>"><?php echo $kpi; ?></option><?php } ?>
  </select>
</p>
  <input type="submit" name="send" value="Submit" id="inputid1"  />
</p>
</form>
</div>
</div>

This is the insert function.

<?php
    ob_start();
        include("db.php");

        if(isset($_POST['send'])!="")
            {
                $pinstatus_type     =mysql_real_escape_string($_POST['pinstatus_type']);
                $kpi_type       =mysql_real_escape_string($_POST['kpi_type']);
                $pinstatus_color        =mysql_real_escape_string($_POST['pinstatus_color']);
                $update         =mysql_query("
                                            INSERT INTO pin_status_types(
                                                                pinstatus_type,
                                                                kpi_type,
                                                                pinstatus_color,
                                                                created
                                                                )
                                                        VALUES(
                                                                '$pinstatus_type',
                                                                '$kpi_type',
                                                                '$pinstatus_color',
                                                                now()
                                                                )
                                                ");

                if($update)
                {
                $msg="Successfully Updated!!";
                    echo "<script type='text/javascript'>alert('$msg');</script>";
                        header('Location:index.php');
                }
                else
                {
                $errormsg="Something went wrong, Try again";
                    echo "<script type='text/javascript'>alert('$errormsg');</script>";
                }
            }
        ob_end_flush();
?>

Answer 1

                        <?php
                        include 'config.php';
                        $sql_states=mysqli_query($conn,"SELECT * FROM master_states");
                        ?>
                        <section Name="state_name">
                            <option value="">section1</option>
                            <option value="">section2</option>

                        </section>

Answer 2

mysql_select_db("$db") or die(mysql_error());

$sql = "SELECT kpi FROM pin_kpi_types";
$query = mysql_query($sql);
echo '<label for="KPIType" id="preinput">Choose KPI Type: </label>';
echo '<select name="KPI" style="width: 400px"  required id="inputid">';
echo '<option value=''>Lead</option>';
while ($row = mysql_fetch_assoc($query)) {
echo '<option value='.$row['KPI'].'>'.$row['KPI'].'</option>';
}
echo '</select>';