MRB MRB -4 years ago 69
AngularJS Question

Bind hidden inputs to model in angular

I have following form:

<form name="frmInput">

<input type="hidden" ng-model="record.usersId" value="{{user.userId}}"/>
<input type="hidden" ng-model="record.userNameId" value="{{user.userNameId}}"/>
<label for="fileNo">AccountId</label>
<input id="fileNo" ng-model="record.fileNo" required/>
<label for="madeSad">MadeSad</label>
<input id="madeSad" ng-model="record.madeSadNo" required/>

<button ng-disabled="!frmInput.$valid" ng-click="SaveRecord(record)">Accept</button>

</form>


I get
record.fileNo
and
record.madeSadNo
in
SaveRecord
function but i don't get
record.usersId
and
record.userNameId
in
SaveRecord
function.

Where am i making mistake?

values of hidden inputs are correct.

Answer Source

Having hidden form fields is not the Angular way. You don't need hidden fields at all, as the all the scope variables (which are not in the form) can be taken as hidden variables.

As for the solution, while submitting the form, just populate the object 'record' with 'user':

function SaveRecord(){
  $scope.record.usersId = $scope.user.userId;
  $scope.record.userNameId = $scope.user.userNameId;
  http.post(url, $scope.record);
}

As a side note, you do not need to mention your variable while calling the function:

<button ng-disabled="!frmInput.$valid" ng-click="saveRecord()">Accept</button>
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download