Set a default value on dropdown list element?](https://stackoverflow.com/questions/3518002/how-can-i-set-the-default-value-for-an-html-select-element) SO question, – Jeroen Heier Jul 16 '18 at 17:50

Question

So to make an option become default, you need to include selected attribute. You can easily do this and add a check with PHP to see if you want to include it. For example;

if($result->num_rows > 0) {
  while($row = $result->fetch_assoc()) {
      $selected = null;
      if($row["selected"] === 1) { //or some other condition
         $selected= "selected";
      }
      echo "<option {$selected} value='".$row['value']."' data-id='".$row['id']."'>".$row['value'].</option>";
  }
}

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option

score 0 · Answer 1 · answered Jul 16 '18 at 17:51

So to make an option become default, you need to include selected attribute. You can easily do this and add a check with PHP to see if you want to include it. For example;

if($result->num_rows > 0) {
  while($row = $result->fetch_assoc()) {
      $selected = null;
      if($row["selected"] === 1) { //or some other condition
         $selected= "selected";
      }
      echo "<option {$selected} value='".$row['value']."' data-id='".$row['id']."'>".$row['value'].</option>";
  }
}

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option

Thanks for your comment. Actually I want the selected attribute to be active when I click on the in for the corresponding value. The above function only sets it as default directly not through the anchor tag. — tryinToLearnGCP, Jul 16 '18 at 18:00

score 0 · Answer 2 · answered Jul 16 '18 at 18:01

0

You did not specify the element ID when calling document.getElementById(). If you are trying to get the id of the for example, you need to use
```
document.getElementById("experience");
```

You also need to specify some kind of an attribute to a to recognize it, example id="link".

Then:

var a = document.getElementById("link").textContent;
var selection = document.getElementById("experience");
selection.value = a;

answered Jul 16 '18 at 18:01

Michael Naidis

116
2
4
15

Thanks @Michael for the information!! It is still not setting the value default when the anchor tag 1 is clicked. – tryinToLearnGCP Jul 16 '18 at 18:06

score 0 · Accepted Answer · answered Jul 18 '18 at 18:20

I found a very easy solution for the problem. By adding the option of data-select in the anchor tag and adding a javascript for on click function. Below is the code changes.

    <table>
    <td align="center">
    <a href="#exp" data-select="1">1</a><br>
  <a href="#exp" data-select="1"">2</a><br>
  <a href="#exp" data-select="1"">3</a><br>
  ...
</table>
<select class="form-control  input-lg" id="experience"name="experience" 
  placeholder="Experience (in Years)" required="">
 <option value="">Experience: </option>
 <?php
              $sql="SELECT * FROM experience";
              $result=$conn->query($sql);
              if($result->num_rows > 0) {
                while($row = $result->fetch_assoc()) {
                  echo "<option value='".$row['value']."' data- 
              id='".$row['id']."'>".$row['value']."</option>";
                }
              }
            ?>
        </select>
        <script type="text/javascript">


    var $expe = $('#experience');
$('a[href="#exp"]').click(function () {
    $expe.val( $(this).data('select') );
});
         </script>

Hope this helps anyone facing this issue.

3 Answers3