Simple Google Dart DropDown Value Change

Question

I'm attempting to change the dropdown text once a button is clicked. Changing position may be a better alternative but I'm not sure how to attempt that. Whenever I change the value of the dropdown to new text, or an attempt, the dropdown displays blank text on the first line when it should say "Select an existing set of query results:".

HTML:

<select id="asset" class="titilium" 
    selectedIndex="{{currentIndex}}" 
    value="{{dropDownValue}}" 
    on-change="{{changedHandler}}" required>
  <option selected disabled value="">Select an existing set of query results:</option>
  <option value="Placeholder">Placeholder</option>
  <option value="Placeholder A">Placeholder A</option>
  <option value="Placeholder B">Placeholder B</option>
  <option value="Placeholder C">Placeholder C</option>
  <option value="Placeholder D">Placeholder D</option>
  <option value="Placeholder E">Placeholder E</option>
  <option value="Placeholder F">Placeholder F</option>
  <option value="Placeholder G">Placeholder G</option>
  <option value="Placeholder H">Placeholder H</option>
  <option value="Placeholder I">Placeholder I</option>
</select>

Dart:

 var dropDownValue = shroot.querySelector("#asset");

resetBtn.onClick.listen((e) {
  dropDownValue.value = "Select an existing set of query results:";
});

Answer 1

You have defined "" as the value for this line. If you want to reset the <select> element you have to set this value

<option selected disabled value="">Select an existing set of query results:</option>
                                ^^

A button click handler like below resets your select.

void clickHandler(Event event) {
  $['asset'].value = "";
}