John Baxter John Baxter - 3 years ago 55
AngularJS Question

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

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 Source

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" />
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download