AngularJS , adding 2 extra input text boxes with id and ng-model and they are not getting submitted

Question

I have been modifying a form which I have done many times. This time someone I cannot figure out WHY it is not sending 2 extra fields

Controller

vm.question = {};

Now most of the time they will be blank, but I don't recall having a problem with blank field values not being sent

Existing field that works

<div class="form-group">
   <label class="col-md-2" for="english">Spanish</label>
   <div class="col-md-10">
     <input type="text" ng-model="vm.question.VerbiageSpanish"
             id="verbiagespanish" name="verbiagespanish"
             class="form-control"
             placeholder="Spanish" />
   </div>
</div>

NEW FIELDS ADDED TO FORM ng-model but are not getting submitted on saving

<div class="form-group">
   <label class="col-md-2" for="english">Parent ID</label>
     <div class="col-md-10">
       <input type="text" ng-model="vm.question.ParentId"
             numbers-only style="width:30px" id="parentid"
             name="parentid" class="form-control" />
     </div>
 </div>
<div class="form-group">
     <label class="col-md-2" for="english">Parent Value</label>
     <div class="col-md-10">
     <input type="text" ng-model="vm.question.ParentValue"
            style="width:220px" id="parentvalue" name="parentvalue" 
            class="form-control"
            placeholder="Parent Value" />
     </div>
</div>

Example of the code, notice that it HAS VerbiageSpanish and all the other fields except for the new ParentId and ParentValue How is this possible?

{
  "Active": true,
  "Name": "test",
  "Description": "test",
  "Verbiage": "test",
  "VerbiageSpanish": "test",
  "directive": {
    "1": true
  },
  "data": {
    "1": "yes"
  },
  "SortOrder": {
    "1": "2"
  }
}

Update based on comments:

1. If I fill out the ParentId and ParentValue, then I see that it is sent over as I even console.log and see it

2. form submit button

    <button type="button" class="btn btn-success" data-dismiss="modal"
            ng-click="vm.saveQuestion(vm.question)">
       Save
    </button>
   

3. controller sends all to a service so it is clearly not even sending to the API when not having any values

   vm.saveQuestion = function (script) {
       var promise = "";
       console.log('savequestion debug', script);
   

when I do put in data into those textboxes I see this

{
  "Active": true,
  "Name": "test",
      "ParentId" : "22",
      "ParentValue": "afafaf",
  "Description": "test",
  "Verbiage": "test",
  "VerbiageSpanish": "test",
  "directive": {
    "1": true
  },
  "data": {
    "1": "yes"
  },
  "SortOrder": {
    "1": "2"
  }
}

Answer 1

I think either initialize those keys as well like in your controller

vm.question.VerbiageSpanish = "";
vm.question.ParentId = "";
vm.question.ParentValue = "";

OR

use ng-init="" in those fields

<input type="text" ng-model="vm.question.ParentValue"
       style="width:220px" id="parentvalue" name="parentvalue" 
       class="form-control"
       ng-init="" placeholder="Parent Value" />