【问题标题】:Is there an if-condition which can be used in Ajax?是否有可以在 Ajax 中使用的 if 条件?
【发布时间】:2019-07-08 10:37:34
【问题描述】:

我正在开发一个允许用户在页面上发布消息的 Web 应用程序。我有两个 ejs 文件:

  1. index.ejs 具有供用户放置信息并呈现来自数据库的用户名和消息的完整列表的表单。

  2. validation.ejs 帮助我用 aJax 显示错误消息(因为我不希望页面在出现错误时刷新,因此我的列表将消失),我正在使用 mongoose为了存储数据,所有的输入要求都在 mongoose 中设置。

当我提交一个空表单时,我收到错误消息显示('name cannot be empty','message cannot be empty'),但是当我再次提交提供的信息时,它仍然显示错误,我的问题是: 有没有办法在 ajax 中使用 "if, else" 条件来显示错误或成功添加用户?

server.js:

var express = require("express");
var mongoose = require("mongoose");
var bodyParser = require("body-parser");
const flash = require("express-flash");
const session = require("express-session");

mongoose.connect(
  "mongodb://localhost/messageDashboard",
  { useNewUrlParser: true },
);
const CommentSchema = new mongoose.Schema(
  {
    commenter: {
      type: String,
      required: [true, "Commenter cannot be empty"],
    },
    comment: {
      type: String,
      required: [true, "Comment cannot be empty"],
    },
  },
  { timestamps: true },
);

const MessageSchema = new mongoose.Schema(
  {
    name: {
      type: String,
      required: [true, "Name cannot be empty"],
    },
    message: {
      type: String,
      required: [true, "Message cannot be empty"],
    },
    comments: [CommentSchema],
  },
  { timestamps: true },
);

const Message = mongoose.model("Message", MessageSchema);

var app = express();
app.set("views", __dirname + "/views");
app.set("view engine", "ejs");
app.use(bodyParser.urlencoded({ extended: true }));
app.use(flash());
app.use(
  session({
    secret: "keyboard cat",
    resave: false,
    saveUninitialized: true,
    cookie: { maxAge: 60000 },
  }),
);

app.get("/", function(req, res) {
  Message.find({}, function(err, messages) {
    if (err) {
      res.redirect("/");
    } else {
      console.log(messages);
      res.render("index", { messages: messages });
    }
  });
});

app.post("/postMessage", function(req, res) {
  var newMessage = new Message(req.body);
  newMessage.save(function(err) {
    if (err) {
      console.log("there is a error when posting", err.errors);
      for (var e in err.errors) {
        req.flash("postMsg", err.errors[e].message);
      }
      res.render("validation", { errors: newMessage.errors });
    } else {
      console.log("success added a user");
      res.redirect("/");
    }
  });
});

app.listen(8000, function() {
  console.log("listening on port 8000");
});
index.ejs: 

<body>
    <h2>Welcome to Message Board </h2> 
    <div id='placeholder'>Placeholder</div>
    <form action='/postMessage' method='post' class='postForm'>
        <h4>Name:</h4>
        <input type='text' name='name'>
        <h4>Message:</h4>
        <input type='text' style="width: 600px; height: 100px;" name='message'><br>
        <button id='submitMessage' style='margin-left: 520px; background-color: darkorange;' type='submit'>Post Message</button>
    </form>
    <script>
        $('.postForm').submit(function(e){
            e.preventDefault()
            $.ajax({
                url: '/postMessage',
                method: 'POST',
                data: $(this).parent().serialize(),
                success: function(serverResponse){
                    console.log('ajax is working')
                    $('#placeholder').html(serverResponse) 
                }
            })
        })
    </script> 

validation.ejs: 

<body>
    <% if(messages.postMsg){ %>
        <% for(var x of messages.postMsg) {%>
            <h5 style='color: crimson'><%= x %></h5>
        <% } %>
    <% } %>
</body>

【问题讨论】:

    标签: jquery node.js ajax express


    【解决方案1】:

    你应该做两件事:

    1. 如果出现问题(例如400Bad Request),则从 API 返回错误响应。
    2. 在您的代码中处理 https://api.jquery.com/deferred.fail/ 以处理这些情况。

    【讨论】:

      猜你喜欢
      • 2012-01-26
      • 2014-06-09
      • 1970-01-01
      • 2021-05-03
      • 1970-01-01
      • 2011-05-19
      • 2018-09-26
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多