I am working with MEAN Stack and I have a form which is included radio

Button which is submitted successfully Now what I want is to edit the record. I want is that the record radio button should be checked according to database value.

How to do that.

my edit form is:-

 <form id = "expensesCreate" class="form-horizontal" name="myForm">
    <div class="form-group">
                            <label for="Phone_no" class="col-sm-3">Address</label>
                            <div class="col-sm-4 @if($errors->has('Phone_no')) has-error @endif">
                                <input class="form-control input-sm" placeholder="" autoplete="off" id="address"  name="address" ng-model="address"  type="address" value ="{{registeruser.address}}" required>
                                <p class="error" ng-show=" myForm.password.$touched && myForm.password.$error.required" >Address is required.</p>
                            </div>
                        </div>

                         <div class="form-group">
                            <label for="Phone_no" class="col-sm-3">Sex</label>
                            <div class="col-sm-4 @if($errors->has('Phone_no')) has-error @endif">
                                Male <input type="radio"  ng-model="sex" value="Male" >
                                FeMale<input type="radio" ng-model="sex" value="Female">

                            </div>
                        </div>
</form>

if sex is male of a particular record into database how to checked or selected male radio button.

I am working with MEAN Stack and I have a form which is included radio

Button which is submitted successfully Now what I want is to edit the record. I want is that the record radio button should be checked according to database value.

How to do that.

my edit form is:-

 <form id = "expensesCreate" class="form-horizontal" name="myForm">
    <div class="form-group">
                            <label for="Phone_no" class="col-sm-3">Address</label>
                            <div class="col-sm-4 @if($errors->has('Phone_no')) has-error @endif">
                                <input class="form-control input-sm" placeholder="" autoplete="off" id="address"  name="address" ng-model="address"  type="address" value ="{{registeruser.address}}" required>
                                <p class="error" ng-show=" myForm.password.$touched && myForm.password.$error.required" >Address is required.</p>
                            </div>
                        </div>

                         <div class="form-group">
                            <label for="Phone_no" class="col-sm-3">Sex</label>
                            <div class="col-sm-4 @if($errors->has('Phone_no')) has-error @endif">
                                Male <input type="radio"  ng-model="sex" value="Male" >
                                FeMale<input type="radio" ng-model="sex" value="Female">

                            </div>
                        </div>
</form>

if sex is male of a particular record into database how to checked or selected male radio button.

• javascript
• jquery
• angularjs
• mean-stack

Share Improve this question Follow edited Dec 23, 2016 at 12:32 Navneeth 98833 gold badges1111 silver badges2929 bronze badges asked Dec 23, 2016 at 11:19 Shahzad IntersoftShahzad Intersoft 77222 gold badges1616 silver badges3838 bronze badges 3

• Is the sex value in the database same with the checkbox values: Male and Female ? (is it camelcase?) – salix Commented Dec 23, 2016 at 11:23
• no it is not same valu is Male and Female – Shahzad Intersoft Commented Dec 23, 2016 at 11:39
• if you change the "value" attribute to be the same with the values in database, it should work. – salix Commented Dec 23, 2016 at 11:49

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 2

You can evaluate the sex property to truthy in your view like so:

<td><input type='radio' ng-checked="p.sex=='male'"></td>
<td><input type="radio"  ng-checked="p.sex=='female'" ></td>

Hope it helps.

Use ng-value property to set the radio button as checked.

 ng-value="true"

<!DOCTYPE html>
<html ng-app="app">

<head>
  <script data-require="[email protected]" data-semver="1.5.8" src="https://opensource.keycdn./angularjs/1.5.8/angular.min.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body ng-controller="myCtr">
  <form id="expensesCreate" class="form-horizontal" name="myForm">
    <div class="form-group">
      <label for="Phone_no" class="col-sm-3">Address</label>
      <div class="col-sm-4 @if($errors->has('Phone_no')) has-error @endif">
        <input class="form-control input-sm" placeholder="" autoplete="off" id="address" name="address" ng-model="address" type="address" value="{{registeruser.address}}" required>
        <p class="error" ng-show=" myForm.password.$touched && myForm.password.$error.required">Address is required.</p>
      </div>
    </div>

    <div class="form-group">
      <label for="Phone_no" class="col-sm-3">Sex</label>
      <div class="col-sm-4 @if($errors->has('Phone_no')) has-error @endif">
        Male
        <input type="radio" name="gender" ng-model="sex" value="male"> FeMale
        <input type="radio" name="gender" ng-model="sex" value="female">

      </div>
    </div>
  </form>
  <script>
    angular.module('app', [])
      .controller('myCtr', function($scope) {
        $scope.sex = 'female'; // Instead of this use database value here
      })
  </script>
</body>

</html>