使用选择框启用按钮

时间:2019-06-24 07:16:11

标签: javascript angular-material

当选择第一个单选按钮时,我有两个单选按钮,当选择了单选按钮时,出现两个选择框。之后,我有一个按钮“ SUBMIT”,我希望当我选择第一个单选按钮时必须启用提交按钮,但是当我选择第二个单选按钮时则必须禁用该按钮,直到两个选择框都没有值。 我在使用HTML的表单组中使用表单来考虑所有字段,当所有字段都具有某个值时,将启用唯一的按钮,但是在上述情况下,我会卡住。

**This is my javascript code.
I m new in this plz help.**


function statecheck(){
    if (document.getElementById('state').checked = true) {
      document.getElementById('ifstate').style.display = 'block';
      document.getElementById('ifapmc').style.display = 'none';
      document.getElementById('ifapmc').disabled = true;
    }
  }

  function stateapmccheck(){
    if (document.getElementById('apmc').checked = true) {
      document.getElementById('ifapmc').style.display = 'block';
      document.getElementById('ifstate').style.display = 'none';
      document.getElementById('ifstate').disabled = true;
    }
  }

这是我的Angular材质代码

    <div>
        <label>Registration Level: </label>&nbsp;
        <mat-radio-group aria-label="Select an option" 
    formControlName="choosereglevel" #reglevel>
              <mat-radio-button value="1" id="state" 
    onclick="javascript:statecheck();" color="primary">State</mat-radio 
 button>&nbsp;
              <mat-radio-button value="2" id="apmc" 
    onclick="javascript:stateapmccheck();" color="primary">APMC</mat-radio- 
   button>
              <!--<mat-error 
    *ngIf="firstFormGroup?.controls?.choosereglevel?.hasError('required')">
                  Please choose one <strong>level.</strong>
              </mat-error>-->
            </mat-radio-group>
          </div>
          <br>
          <!--hidden select box-->
          <div id="ifstate" style="display:none;">
          <mat-form-field>
            <mat-label>Registered With State: </mat-label>  
              <mat-select formControlName="choosestate" #selectstate>
                <mat-option *ngFor="let selectstate of registrationstate" 
    [value]="selectstate.value">
                  {{selectstate.viewValue}}
                  </mat-option>
                </mat-select>
            </mat-form-field>
          </div> 
            <!--second T&C select box-->
            <div id="ifapmc" style="display:none;">
              <mat-form-field>
              <mat-label>Registered With State: </mat-label>  
                <mat-select formControlName="choosestate" #selectstate>
                  <mat-option *ngFor="let selectstate of registrationstate" 
    [value]="selectstate.value">
                    {{selectstate.viewValue}}
                  </mat-option>
                </mat-select>
              </mat-form-field> 
              <mat-form-field>
                <mat-label>Registered With APMC: </mat-label>  
                <mat-select formControlName="chooseapmc" #selectapmc>
                  <mat-option *ngFor="let selectstate of 
registrationapmcstate" 
    [value]="selectstate.value">
                    {{selectstate.viewValue}}
                  </mat-option>
                </mat-select>
              </mat-form-field>
            </div>

1 个答案:

答案 0 :(得分:0)

在我看来,if(...)语句中有语法错误

使用单个=符号时,它会将属性设置在其左侧以与右侧的值相匹配

要进行比较,您需要双==

所以尝试document.getElementById('state').checked == trueif document.getElementById('apmc').checked == true