在节点控制台上未定义

时间:2019-05-02 04:03:06

标签: jquery node.js

enter image description here

我正在尝试发出放置请求,但是每当我执行一个放置请求时,控制台上都会出现未定义的请求,并且在PUT上也会显示200状态代码,但我的数据不会更新

const express = require('express');
const app = express();
const mysql = require('mysql');
const bodyparser = require('body-parser');
app.use(bodyparser.urlencoded({ extended: true }));
app.use(bodyparser.json());
const mysqlConnection = mysql.createConnection({
  host: 'localhost',
  user: 'root',
  password: 'Adil@123',
  database: 'movies'

});
mysqlConnection.connect(err=>{
  if (err) {
    console.log('It was not successful \n Error:' + JSON.stringify(err,undefined,2));
  } else {
    console.log('Its a success');
  }
  });
 //  Collecting all the movies from the movielist
  app.get('/movielist',(req,res)=> {
    mysqlConnection.query("SELECT * FROM movielist", (err, rows,fields)=> {
      if (!err) {
        res.send(rows);
      } else {
        console.log(err);
      }
    });
  });
 // Finding a movie based on the `idmovielist` number
   app.get('/movielist',(req,res) => {
    mysqlConnection.query("SELECT * FROM movielist WHERE idmovielist = ?",[req.params.id],(err, rows,fields) =>{
    if (!err) {
      res.send(rows);
    } else {
    console.log(err);
    }
    });
  });

  // Delting a movie
   app.delete('/movielist/:id',(req,res) => {
    mysqlConnection.query("DELETE FROM movielist WHERE idmovielist = ?",[req.params.id],(err,rows,fields) =>{
      if (!err) {
        res.send("Movie is deleted");
      } else {
      console.log(err);
    }
    });
  });
  // Inserting a movie
  app.post('/movielist/addMovie',(req, res) => {
    //console.log("movielist/addMovie : ",req.body);
   mysqlConnection.query("INSERT INTO movielist (`idmovielist`,`name`,`thumnail_path`,`description`,`language_released`,`year_released`) VALUES ('"+req.body.idmovielist+"', '"+req.body.name+"','"+req.body.thumnail_path+"', '"+req.body.description+"', '"+req.body.year_released+"', '"+req.body.language_released+"')",
   (err,rows) => {
     if (!err) {
       res.send("Movie is added");
     } else {
       console.log(err);
     }
  });
});

app.put('/movielist/updateMovie/:id',(req,res) =>{
  let update = req.body;
  console.log(update.name);
  mysqlConnection.query("UPDATE movielist SET name = '?', thumnail_path = '?', description = '?', year_released = '?', language_released = '?' WHERE idmovielist = ?",
  [update.name,update.thumnail_path,update.description,update.year_released,update.language_released,req.params.id], function (err, results) {
    if (!err) {
      res.send("Movie list is updated");
    } else {
      console.log(err);
    }
  });
});

// localhost:3000
app.listen(3000,() => {
  console.log('We got it running');
});
module.exports = app;

$(function() {
  $.ajax({
      method:"GET",
      url: "http://localhost:3000/movielist",
      dataType: "json",
      success: function (response) {
        $.each(response, function(i, movie) {
        const rowText = "<tr>" +
            "<td>" + movie.idmovielist + "</td>" +
            "<td>" + movie.name + "</td>" +
            "<td>" + movie.thumbnail_path + "</td>" +
            "<td>" + movie.description + "</td>" +
            "<td>" + movie.year_released + "</td>" +
            "<td>" + movie.language_released + "</td>" +
            "<td>" + "<button button id = \"deleteMovie\" type=\"button\" class=\"btn btn-danger\" data-toggle=\"modal\" data-target=\"#exampleModal2\">Delete</button>" + "</td>" +
            "<td>" + "<button button id = \"editMovie\" type=\"button\"  class=\"btn btn-danger\" data-toggle=\"modal\" data-target=\"#exampleModal2\">Edit</button>" + "</td>";
          $("#movies").append(rowText);
        });

renderMovieList('movies');
  function renderMovieList(){
  $.ajax({
    method:"GET",
    url: "http://localhost:3000/movielist",
    dataType: "json",
    success: function (response) {
      $('#movies').empty();
    $.each(response, function(i, movie) {
    const rowText = "<tr>" +
      "<td>" + movie.idmovielist + "</td>" +
      "<td>" + movie.name + "</td>" +
      "<td>" + movie.thumbnail_path + "</td>" +
      "<td>" + movie.description + "</td>" +
      "<td>" + movie.year_released + "</td>" +
      "<td>" + movie.language_released + "</td>" +
      "<td>" + "<button button id = \"deleteMovie\" type=\"button\" class=\"btn btn-danger\" data-toggle=\"modal\" data-target=\"#exampleModal2\">Delete</button>" + "</td>" +
      "<td>" + "<button button id = \"editMovie\" type=\"button\"  class=\"btn btn-danger\" data-toggle=\"modal\" data-target=\"#exampleModal2\">Edit</button>" + "</td>";
      $("#movies").append(rowText);
    });
    }
  });
}
  $("#movieAdded").click(function(a) {
    a.preventDefault();

    let mydata = {
      idmovielist: $($("#newForm")[0].intNum).val(),
      name: $($("#newForm")[0].name).val(),
      thumnail_path: $($("#newForm")[0].thumnail_path).val(),
      description: $($("#newForm")[0].description).val(),
      year_released: $($("#newForm")[0].year_released).val(),
      language_released: $($("#newForm")[0].language_released).val(),
    }

    displayMovie(mydata);

    $("#newForm").trigger("reset");
    $("#newForm").toggle();
  });

  $("#updateMovie").on("click", function(a) {
    a.preventDefault();

    let data = {
      idmovielist: $($("#updateForm")[0].intNum).val(),
      name: $($("#updateForm")[0].name).val(),
      thumnail_path: $($("#updateForm")[0].thumnail_path).val(),
      description: $($("#updateForm")[0].description).val(),
      year_released: $($("#updateForm")[0].year_released).val(),
      language_released: $($("#updateForm")[0].language_released).val(),
    }

    putMovie($($("#updateForm")[0].movieId).val(), data);

    $("#updateForm").trigger("reset");
    $("#updateForm").toggle();
});

function getOneMovie(id) {
  $.ajax({
    url: "http://localhost:3000/movielist" + id,
    method: 'GET',
    dataType: 'json',
    success: function(data) {
      $($("#updateForm")[0].movieId).val(data._id);
      $($("#updateForm")[0].intNum).val(data.intNum);
      $($("#updateForm")[0].name).val(data.name);
      $($("#updateForm")[0].thumnail_path).val(data.thumnail_path);
      $($("#updateForm")[0].description).val(data.description);
      $($("#updateForm")[0].year_released).val(data.year_released);
      $($("#updateForm")[0].language_released).val(data.language_released);
      $("#updateForm").show();
    }
  });
}

function displayMovie(mydata) {
  $.ajax({
    method: "POST",
    url: "http://localhost:3000/movielist/addMovie",
    dataType: "json",
    data: mydata,
    success: function(data) {
       console.log(data);
      renderMovieList();
}
});
}

function loadButtons() {
              $(".editMovie").click(function (a) {
                  getOneMovie($($(this)[0]).data("movieId"));
                  a.preventDefault();
              });

              $(".deleteMovie").click(function (a) {
                  deleteMovie($($(this)[0]).data("movieId"));
                  a.preventDefault();
              });
          }

loadButtons();
function putMovie(data) {
  $.ajax({
    url: "http://localhost:3000/movielist/updateMovie/12",
    method: 'PUT',
    dataType: 'json',
    data: data,
    success: function(data) {
      console.log(data);
      getOneMovie();
    }
  });
}



function deleteMovie() {
  $.ajax({
    url: "http://localhost:3000/movielist/4",
    method: 'DELETE',
    dataType: 'json',
    success: function(data) {
      console.log(data);
    }
  });
}

}
})

});

所以这是我在前端和后端上方的app.js和mycrud.js,我在所有库伦名称上都加上了单引号,我真的不知道此未定义来自何处,这是我未定义的列名称之一

2 个答案:

答案 0 :(得分:0)

app.put('/movielist/updateMovie/:id',(req,res) =>{ let update = req.body; console.log(update.name);//where is update defined? mysqlConnection.query("UPDATE movielist SET name = '?', thumnail_path = '?', description = '?', year_released = '?', language_released = '?' WHERE idmovielist = ?", [update.name,update.thumnail_path,update.description,update.year_released,update.language_released,req.params.id], function (err, results) { if (!err) { res.send("Movie list is updated"); } else { console.log(err); } }); });

您的问题/代码有点混乱,因此我不能100%确定自己正确回答了问题,但似乎未定义update.name。在执行放置请求时,您可能希望在客户端记录该请求甚至答案。

答案 1 :(得分:0)

我认为问题出在您的console.log(update.name)。 让我解释这个问题的原因。让我们看看以下

putMovie($($("#updateForm")[0].movieId).val(), data);

上面的一个是您的调用函数,在这里您可以看到两个参数正在传递。

但是在您调用的函数中

function putMovie(data) {
    $.ajax({
        url: "http://localhost:3000/movielist/updateMovie/12",
        method: 'PUT',
        dataType: 'json',
        data: data,
        success: function(data) {
          console.log(data);
          getOneMovie();
       }
  });
}

在此函数定义中,您仅使用了一个参数。所以问题是当您调用此函数时,您将 data 作为第二个参数传递。但是它从未在函数定义中使用过。

function putMovie("",data) {
$.ajax({
    url: "http://localhost:3000/movielist/updateMovie/12",
    method: 'PUT',
    dataType: 'json',
....

如果您这样做,可以将数据传递到api。