Dart 如何以编程方式单击或选择单选按钮？

Question

在两种情况下，我需要能够通过软件单击或更改选定的单选按钮，但我不知道该怎么做。

一个例子是用户在错误的时间点击了按钮。我明白了，但是现在单击的按钮显示为已选中，因此我需要将其更改回来。

另一种情况是当用户将显示与在其他地方维护的主数据库同步时（在同时运行的单独 Java 应用程序中）并且存在需要更正的差异。

在我的 HTML 文档中

      <div id='radio-btns' class='radio-btns'>
        <input id='B12' type='radio' name='radio-btn' checked>
          <label id='lblB12' class='radiobutton-label' for='B12'>IR&nbsp;</label>
        <input id='BWB' type='radio' name='radio-btn' >
          <label id='lblBBW' class='radiobutton-label' for='BWB'>Wide</label>
        <input id='B10' type='radio' name='radio-btn' >
          <label id='lblB10' class='radiobutton-label' for='B10'>B10</label>
        <input id='B08' type='radio' name='radio-btn' >
          <label id='lblB8' class='radiobutton-label' for='B08'>B8&nbsp;</label>
      </div>

在客户端 Dart 代码中：

querySelectorAll('input[type="radio"]').onClick.listen(bandBtnClicked);

// later on in onClick()
ButtonElement bandBtn = querySelector('#$correctBand'); 

bandBtn 不为空，但我不知道如何使用它来模拟点击。我想我宁愿取消选择错误单击的单选按钮，然后选择应该单击的单选按钮。我试过的都没有用。

[编辑]这行得通！

ButtonInputElement bandBtn = querySelector('#$correctBand');
bandBtn.click();

Answer 1

您可以更改选中的单选按钮，如下所示。如果您更新您的问题以使其更清楚，我可能会提供更好的解决方案（如果这不是您想要完成的）。

html:

<div id='radio-btns' class='radio-btns'>
  <input id='B12' type='radio' name='radio-btn' checked>
    <label id='lblB12' class='radiobutton-label' for='B12'>IR&nbsp;</label>
  <input id='BWB' type='radio' name='radio-btn' >
    <label id='lblBBW' class='radiobutton-label' for='BWB'>Wide</label>
  <input id='B10' type='radio' name='radio-btn' >
    <label id='lblB10' class='radiobutton-label' for='B10'>B10</label>
  <input id='B08' type='radio' name='radio-btn' >
    <label id='lblB8' class='radiobutton-label' for='B08'>B8&nbsp;</label>
</div>

<button>click me</button>

飞镖：

main () {
  dom.querySelectorAll('input[type="radio"]').onClick.listen(bandBtnClicked);
  dom.querySelectorAll('button').onClick.listen(bandBtnClicked);
}

void bandBtnClicked(event) {
  (dom.querySelector('#B08') as dom.RadioButtonInputElement).checked = true;
}