0

Edit: NEVERMIND - I made a small mistake in the Angular service. My bad.

I'm trying to teach myself more backend by building a simple CMS using angular, Node and Express, and PostgreSql. I figured out how to do achieve all the CRUD functionality except UPDATE. I thought I understood what to do but I can't figure out where I'm going wrong. I keep getting a 404. What am I misunderstanding or going about the wrong way? I know this is simple but I'm pretty new so any help in understanding where I'm getting confused is really appreciated. Here's the relevant code:

HTML

<form ng-submit="updateBlogEntry(specificBlog.id, specificBlog.title, specificBlog.author, specificBlog.imageurl, specificBlog.content)">
    <h2>Title:</h2>
        <input type="text" ng-model="specificBlog.title"></input>
      <br>
    <h3>Author:</h3>
        <input type="text" ng-model="specificBlog.author"></input>
      <br>
    <h3>Photo:</h3>
        <input type="text" ng-model="specificBlog.imageurl"></input>
      <br>
    <h3>Content:</h3>
      <textarea type="text" rows="5" cols="50" ng-model="specificBlog.content">
      </textarea>
      <br>
    <button type="submit">Save Changes</button>
  </form>

Angular Controller

  var id = $stateParams.id;
  var title = $stateParams.title;
  var author = $stateParams.author;
  var imageurl = $stateParams.imageurl;
  var content = $stateParams.content;

  $scope.updateBlogEntry = function(id, title, author, imageurl, content) {
    adminService.updateBlogEntry(id, title, author, imageurl, content);
  }

Angular Service

this.updateBlogEntry = function(id, title, author, imageurl, content) {
    return $http({
      method: 'PUT',
      url: 'updateBlogEntry/' + id,
      data: {
        id: id,
        title: title,
        author: author,
        imageurl: imageurl,
        content: content
      }
    })
    .success(function(data) {
      alert("Entry Updated");
    })
    .error(function(data) {
      alert("Error Updating"); 
    })

Server Index

// EXTERNAL MODULES //
var express = require('express');
var bodyParser = require('body-parser');
var session = require('express-session');
var massive = require('massive');

// CONFIG //
var config = require('./config');

// EXPRESS //
var app = module.exports = express();

app.use(express.static(__dirname + './../dist'));
app.use(bodyParser.json());

// MASSIVE //
var massiveUri = config.MASSIVE_URI;
var massiveServer = massive.connectSync({
    connectionString: massiveUri
});
app.set('db', massiveServer);
var db = app.get('db');

var dbSetup = require('./services/dbSetup');
dbSetup.run();

// CONTROLLERS //
var userCtrl = require('./controllers/userCtrl');
var blogCtrl = require('./controllers/blogCtrl');


// Blog Endpoints //
app.post('/api/createBlogEntry', blogCtrl.createBlogEntry);
app.get('/api/getBlogEntries', blogCtrl.readBlogEntries);
app.get('/api/getBlogEntry/:id', blogCtrl.readBlogEntry);
// BUG Why isn't this working?
app.put('/api/updateBlogEntry/:id', blogCtrl.updateBlogEntry);

// CONNECTIONS //
var port = config.PORT;
app.listen(port, function() {
    console.log('Listening on port ' + port);
});

Node Controller

updateBlogEntry: function(req, res, next){
        db.blogs.blog_update([
            req.params.id,
            req.body.title,
            req.body.author,
            req.body.imageurl,
            req.body.content
        ],
        function(err, results){
            if (err){
                console.error(err);
                res.send(err);
            } else {
                res.send(results[0]);
            }
        })
    }

blog_update.sql

UPDATE blogs
set
  title     = COALESCE($2, title),
  author    = COALESCE($3, author),
  imageurl  = COALESCE($4, imageurl),
  content   = COALESCE($5, content)
WHERE id = $1

RETURNING * ;

The error in the console:

angular.js:11881 PUT http://localhost:3000/updateBlogEntry/1 404 (Not Found)
8
  • shouldnt it be http://localhost:3000/api/updateBlogEntry/1 :p Commented May 15, 2017 at 4:42
  • The console error? Commented May 15, 2017 at 4:54
  • No this part ` url: 'updateBlogEntry/' + id,` It should be url: '/api/updateBlogEntry/' + id, As per your express routes Commented May 15, 2017 at 4:55
  • YES! That worked! Man, I knew it was something small I just wasn't seeing! Thank you. Commented May 15, 2017 at 5:02
  • Added as answer :) you are welcomed . Commented May 15, 2017 at 5:05

1 Answer 1

1

You have written your URL wrong.

It should be /api/updateBlogEntry as per your Node's express routes.

change this part

` url: 'updateBlogEntry/' + id,` 

It should be

url: '/api/updateBlogEntry/' + id,

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

Comments

Your Answer

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