Form Value update using Angular js, Node Js , express js and Mongo DB

Question

I'm totally new to MEAN and working on demo project where I can perform basic CRUD activity using Nodejs,Express, Angular js and Mongo DB but facing issue during update.

I don't know how to call Mongo DB update query using Angular js ng-click. I can fetch data from Mongo DB which is showing in the screenshot below.

But I want to update the values if user make any change in the values and press submit. I'm using ng-click for update.

I'm trying it for last two days but not able to find any solution, I've checked few example but find it they have different approach .

Any help will be appreciated

Html View :

HTML View Code :

    <table cellspacing="0" cellpadding="0" border="0" id="id-form" ng-app="app-setting" ng-controller="SettingController" >
    <tbody><tr>

        <th valign="top">Facebook Link:</th>
        <td><input type="text" class="inp-form" ng-model="settings.facebook"></td>
        <td></td>
    </tr>
    <tr>
        <th valign="top">Twitter Link:</th>
        <td><input type="text" class="inp-form" ng-model="settings.twitter"></td>

    </tr>


    <tr>
        <th valign="top">Google+:</th>
        <td><input type="text" class="inp-form" ng-model="settings.googleplus"></td>
        <td></td>
    </tr>

        <tr>
        <th valign="top">Youtube:</th>
        <td><input type="text" class="inp-form"  ng-model="settings.youtube"></td>
        <td></td>
    </tr>

            <tr>
        <th valign="top">Email:</th>
        <td><input type="text" class="inp-form" ng-model="settings.email"></td>
        <td></td>
    </tr>

            <tr>
        <th valign="top">Contact #:</th>
        <td><input type="text" class="inp-form" ng-model="settings.contactnumber"></td>
        <td></td>
    </tr>




<tr>
    <th>&nbsp;</th>
    <td valign="top">
        <input type="submit" class="form-submit" value="update" ng-click="update(settings)">

    </td>
    <td></td>
</tr>
</tbody></table>
<!-- end id-form  -->

Controller :

.module('app-setting')
.controller('SettingController',SettingController);

function SettingController($scope, $http ) {
 $scope.page = "Setting";

 $http.get('/admin/get-setting-list')
  .then(function(res){
      $scope.settings = res.data;  

    });


   $scope.update = function(data){
     //what will be here 

 };

Routes :

 var Setting = require('../models/setting').Setting;

 router.put('/admin/setting/:id', function(req, res, next) {
 Setting.findAndModify(req.params.id,req.body, function (err, post)  {
 if (err) return next(err);
  user:res.json(post);
 });

});

Model :

     var mongoose = require('mongoose');
var Schema = mongoose.Schema;

var adminService = new Schema({
  facebook: String,
  youtube: String,
  googleplus:  String,
  twitter:String,
  email:String,
  contactnumber:String,
  created: {type: Date, default: Date.now}
});

var Setting = mongoose.model('Setting', adminService);

module.exports = {
  Setting : Setting
};

Janusz01 · Accepted Answer · 2016-12-19 19:44:26Z

2

Well, your HTML calls update method and passes settings object to it, which looks ok in angular controller.

By looking at your node.js code, you need to call

$http.put('/admin/setting/:id',....) in settingController

ref: https://docs.angularjs.org/api/ng/service/$http

and you need to understand http methods http://www.w3schools.com/tags/ref_httpmethods.asp

edited Dec 19, 2016 at 19:44

Janusz01

5172 gold badges4 silver badges12 bronze badges

answered Oct 13, 2015 at 10:34

Aishwat Singh

4,5093 gold badges30 silver badges50 bronze badges

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

7 Comments

Doitnow Over a year ago

Thanks for reply, Can you please confirm how i can pass form values along with id so that it can be Handel in my route, I have written ` $scope.update = function(user){ var id= user._id; $http.put('/admin/setting/:'+id,user) ; }; ` But it is not working

Aishwat Singh Over a year ago

//for id u need to have some unique field , either try to generate a unique key at client end or mongo gives a default document id. However in ur case u can use contact num as unique ` $scope.update = function(data){ $http.post('/admin/setting/:'+data. contactnumber, data, config).then(successCallback, errorCallback); };

Doitnow Over a year ago

Yes, I have written this $scope.update = function(data){ var id= data._id; $http.put('/admin/setting/:'+id,data) ; }; But it is not working, can you please suggest i have passed id and Form data correctly or missing something

Aishwat Singh Over a year ago

hey , ur data is nothing but settings json coming from html , and i don't see settings having a _id key , so ya it's wrong try console.log(id); and y a downvote man ?

Aishwat Singh Over a year ago

:561b61e96abd5c1a1011e8bb must be 561b61e96abd5c1a1011e8bb, colons ain't needed and have a look at example code github.com/aishwat/flowAppServer u need app.put() not app.use()

|

Collectives™ on Stack Overflow

Form Value update using Angular js, Node Js , express js and Mongo DB

1 Answer 1

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related