首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >多个单选按钮不起作用,只需第一个按钮

多个单选按钮不起作用,只需第一个按钮
EN

Stack Overflow用户
提问于 2019-05-27 07:19:58
回答 1查看 164关注 0票数 0

我是个编程新手,我肯定犯了一个我不知道的简单错误。

我的angular应用程序有两个模态,第一个是要添加的表单,第二个是编辑。

当我使用第一种模式时,单选按钮可以工作,但当我尝试第二种模式时,单选按钮就不起作用了。就好像它们被禁用了一样。

我注意到的一件事是,当我使用键盘上的tab键时,可以通过键盘选择单选按钮。

我还注意到,如果我更改了在正常工作的代码之前没有工作的单选按钮的模式的代码,这会颠倒问题。

被“呈现”的代码首先起作用。

代码语言:javascript
复制
<!-- fist RadioButton -->
<div class="md-form">
  <div class="d-flex justify-content-around">
    <p>Tipo da Instituição: </p>
    <div class="custom-control custom-radio custom-control-inline">
      <input formControlName="tipoedit" type="radio" class="custom-control-input" id="publica" name="tipoedit"
        value="Publica">
      <label class="custom-control-label" for="publica">Publica</label>
    </div>
    <div class="custom-control custom-radio custom-control-inline">
      <input formControlName="tipoedit" type="radio" class="custom-control-input" id="privado" name="tipoedit"
        value="Privado">
      <label class="custom-control-label" for="publica">Privado</label>
    </div>
  </div>
  <div *ngIf="submitted && fedit.type.errors" class="invalidFeedback">
    <div *ngIf="fedit.type.errors.required">Tipo é obrigatorio</div>
  </div>
</div>

<!-- Second RadioButton -->
<div class="md-form">
  <div class="d-flex justify-content-around">
    <p>Tipo da Instituição: </p>
    <div class="custom-control custom-radio custom-control-inline">
      <input formControlName="tipo" type="radio" class="custom-control-input" id="publica" name="tipo"
        value="Publica">
      <label class="custom-control-label" for="publica">Publica</label>
    </div>
    <div class="custom-control custom-radio custom-control-inline">
      <input formControlName="tipo" type="radio" class="custom-control-input" id="privado" name="tipo"
        value="Privado">
      <label class="custom-control-label" for="privado">Privado</label>
    </div>
  </div>
  <div *ngIf="submitted && fadd.tipo.errors" class="invalidFeedback">
    <div *ngIf="fadd.tipo.errors.required">Tipo é obrigatorio</div>
  </div>
</div>
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2019-05-27 07:35:32

问题似乎出在标签上的for属性以及具有相同ids的多个元素的事实上。我强烈建议永远不要有两个ids相似的HTML元素。

尝试更改第二个无线电模式的ids (类似于privadoEdit/publicaEdit ),并相应地更改for属性。

此外,第一个模式在两个标注的for属性中都有publica,将第二个属性更改为privado

希望这篇文章能有所帮助

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/56318107

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档