Default value in drop down list

Question

I have to show the 'Choose option' as a disabled option in drop down list. The drop down list is displayed from another page.

page1.php

<div class="col-md-4">
            <select  class="form-control" name="task" id="task" required>
             <option selected="selected" value="">Choose Task</option>
             <option selected="selected" value="task1">Task 1</option>
             <option selected="selected" value="task2">Task 2</option>
            </select>
           </div>
        <div class="col-md-4">
          <select  class="form-control" name="subtask" id="subtask" required>
             <option selected="selected" value="">Choose SubTask</option>
           </select>
         </div>

javascript part:

$("#task").change(function()
{
    var id=$(this).val();
    $.ajax
    ({
        type: "POST",
        url: "query.php",
        data:{id: id,
            task: 1,
        },
        cache: false,
        success: function(html)
        {
            $("#subtask").html(html);
        } 
    });
});

query.php

if($_POST['task'])
{
    $id1=$_POST['id'];
    $sql2="SELECT * FROM sub WHERE task_int='$id1'";
    $result2=$conn->query($sql2);
    echo '<option disabled selected value> Choose option</option>';
    while($row2=$result2->fetch_assoc())
    {
        $id=$row2['sub_int'];
        $data=$row2['sub_name'];
        echo '<option value="'.$id.'">'.$data.'</option>';
    }
}   

I have tried the above code but it is not showing "Choose Option" on top of other data retrieved from database.

Answer 1

<div class="col-md-4"><select class="form-control" name="task" id="task" required="">
        <option selected="selected" value="0" disabled="disabled">Choose option</option>
        <option value="">Choose Task</option>
        <option value="task1">Task 1</option>
        <option value="task2">Task 2</option>
    </select></div>
<div class="col-md-4"><select class="form-control" name="subtask" id="subtask" required="">
        <option selected="selected" value="" disabled="disabled">Choose option</option>
        <option value="">Choose SubTask</option>
    </select></div>`enter code here`

Answer 2

You have to change your php code to this

if($_POST['task'])
{
    $id1=$_POST['id'];
    $sql2="SELECT * FROM sub WHERE task_int='$id1'";
    $result2=$conn->query($sql2);
    echo '<select  class="form-control" name="subtask" id="subtask" required>';
     echo '<option value>Choose SubTask</option>';
     echo '<option disabled  selected value> Choose option</option>';
    while($row2=$result2->fetch_assoc())
    {
        $id=$row2['sub_int'];
        $data=$row2['sub_name'];
        echo '<option value="'.$id.'">'.$data.'</option>';
    }
   echo '</select>'
}