如何在 select 标签中添加单个选项的链接

Question

hello I am trying to create a category select dropdown which consists of some data coming from database I have created a page named addcategory.php and I am trying to add a in the select tag something like "add new category" I tried several methods like onchange function in javascript but it gets applied to the whole select menu I only want to add a link to the last option of the select tag below I am attaching the code which I am using.

<select class="w-100" id="categoryselect" name="selectcat" required>
  <option value="" disabled selected>Select Category</option>
    <?php 
        $sql="SELECT * FROM categories";
        $result=mysqli_query($conn, $sql);
        while($row=mysqli_fetch_array($result))
        {
            echo '<option value="'.$row["cat_id"].'">'.$row["name"].'</option>';
        } 
    ?>
  <option value="categories" onClick="window.location = 'addcategory.php'">Add New Category</option>
</select>

Answer 1

Bind the event handler to select tag instead of bind the event into options tag.

The onchange event occurs when the value of an element has been changed.

<select class="w-100" id="categoryselect" name="selectcat" onChange="if(this.value=='categories') window.location='addcategories.php'">
      <option value="" disabled selected>Select Category</option>
        <?php 
            $sql="SELECT * FROM categories";
            $result=mysqli_query($conn, $sql);
            while($row=mysqli_fetch_array($result))
            {
                echo '<option value="'.$row["cat_id"].'">'.$row["name"].'</option>';
            } 
        ?>
      <option value="categories">Add New Category</option>
    </select>