Home  >  Article  >  Web Front-end  >  Get the value method of the default selected radio button in angularjs (detailed tutorial)

Get the value method of the default selected radio button in angularjs (detailed tutorial)

亚连
亚连Original
2018-06-02 17:45:142126browse

Below I will share with you an angularjs method to obtain the value of the default selected radio button. It has a good reference value and I hope it will be helpful to everyone.

In the Html page, there are three radio buttons. The second "Important" option is selected by default. Set ng-checked="true" to select this option by default, but when submitting the form , but it prompts that $scope.level is in the undefined state. Why is it undefined when it is clearly selected by default?

So, I tested it first: write the following code on the Html page:

<span style="font-size:18px;"><p ng-controller="testCtrl"> 
 <p > 
  <label > 
   <input type="radio" value="Normal" ng-model="level" name="level" 
   >一般 
  </label> 
  <label > 
   <input type="radio" value="Important" ng-model="level" name="level" 
     ng-checked="true" 
   >重要 
  </label> 
  <label > 
   <input type="radio" value="Urgent" ng-model="level" name="level" 
   >紧急 
  </label> 
 
 
 </p> 
  <p> {{ level }}</p>    //显示单选按钮选中的value 
</p></span>

The page is loaded for the first time, although " The "Important" radio button is selected by default, but the page does not display the value corresponding to the "Important" radio button.

Click the "Emergency" button, and the value of the "Emergency" button will be displayed below,

It turns out that when the page is loaded, $scope.level is not assigned a value and has no initial value. Even if ng-checked="true", the default selected value is not displayed! Need to be set in js: $scope.level= "Important"; At this time, refresh the page and the value of the selected button will be displayed by default:

The above is what I compiled for everyone. I hope it will be useful to everyone in the future. help.

Related articles:

Instance code of tree-shaped dish implemented by vue

p5.js introductory tutorial keyboard interaction

Summary of VUE key issues

The above is the detailed content of Get the value method of the default selected radio button in angularjs (detailed tutorial). For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn