1

I want add data to the existing model post submitting the data, below is the code

HTML Code

<input type="text" ng-model="configData.A1" />
<input type="text" ng-model="configData.A2" />
<input type="text" ng-model="configData.A3" />
<input type="text" ng-model="configData.A4" />
<button class="btn" ng-click="saveData(configData)">Save Data</button>

Angular js code

$scope.saveData = function (configData) {
   //Want to add below commented data into existing configData
   //configData.uniqueId = $scope.config.uid;
   //configData.uniqueName = $scope.config.uName;
   $http.post(saveConfigData_api, configData).then(function (data) {
        $('#progressbar').hide();
   });
 };
Improve this question
3
  • Use $scope to make changes to your model object Commented Apr 13, 2018 at 11:13
  • Why not use an array in configData instead of A1, A2, A3... And then you can use a repeater to generate as many inputs as the number of elements there. And as others pointer out, on your click, you don't have to pass your configData because the function handler will have access to $scope and can work with the data directly. Commented Apr 20, 2018 at 13:43
  • SOLVED: By adding two hidden fields for uniqueId and uniqueName Commented Apr 22, 2018 at 5:16

2 Answers 2

Reset to default
1

You don't actually need to pass the configData in saveData function as it is a model data in AngularJS so you can access it through $scope. Passing that as a function parameter will not reflect the changes in configData model. So, change your code to

HTML

<input type="text" ng-model="configData.A1" />
<input type="text" ng-model="configData.A2" />
<input type="text" ng-model="configData.A3" />
<input type="text" ng-model="configData.A4" />
<button class="btn" ng-click="saveData()">Save Data</button>

CONTROLLER

$scope.saveData = function () {
   $scope.configData.uniqueId = $scope.config.uid;
   $scope.configData.uniqueName = $scope.config.uName;
   $http.post(saveConfigData_api, configData).then(function (data) {
        $('#progressbar').hide();
   });
 };

Using $scope.configData will make changes to the configData model.

Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

Did not work with the following error "Cannot set property 'UniqueId' of undefined"
set $scope.configData = {} at the top of your controller which is used by that HTML @user8624282
doing that i'll lose data from input elements which i pass to my controller
since you are using ng-model="configData.A1" you need to initialise that $scope.configData = { A1: '', A2: '', A3: '', A3: '' } in controller
0 
$scope.saveData = function (configData) {
   //Want to add below commented data into existing configData
   configData.uniqueId = $scope.config.uid;
   configData.uniqueName = $scope.config.uName;
   $http.post(saveConfigData_api, configData).then(function (data) {
        $('#progressbar').hide();
   });
 };

This should do the trick, or i understood the question wrong.

Improve this answer

2 Comments

I want to add new data into existing configData before post
if thats the case, just do what you have in the comments (see updated answer)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.