Javascript 使用主干模型和集合提交AJAX

我遵循教程，并尝试将其应用到我的简单登录用例中

简单的jQuery ajax调用是：

$.ajax({
    type: "POST",
    url: "/api/element/User.php",
    data: {
        req: "REQUSERSIGNIN",
        platform: "WEB",
        useremail: $('form#userSignIn #userEmail').val(),
        userpass: $('form#userSignIn #userPassword').val()
    },
    dataType: "json",
    success: function(data) {
        console.log("you've been logged in!"
    }
});

当然，这需要：

$('form#userSignIn').submit();

我使用主干网的尝试是：

var events = _.clone(Backbone.Events);

var SigninModel = Backbone.Model.extend({
    url: '/api/element/User.php'
});

    var SignInCollection = Backbone.Collection.extend({
        model: SignInModel
    });

var SigninView = Backbone.View.extend({
    events: {
        'submit form#userSignIn': 'signIn'
    },

    initialize: function() {
        console.log('Sign in view initialized');
    },

    signIn: function(e) {
        e.preventDefault();

        // How do I pass in the data as above?

    }
});

$(document).ready(function(){
    // What do I instantiate to make it all work?
});

---

如何传入数据？

要启动整个过程，您需要：

var view = new SigninView({
  model: new SignInModel(),
  el: $('#some-element')
}).render();

为了进一步解释，$（'some-element'）将获取页面上的一些现有html，即

<div id="some-element"></div>

您还需要一个模板属性作为登录视图的一部分。要做到这一点，您需要使用 模板。在您的登录视图中：

template: _.template(//some html goes here)

最后，您需要从表单输入中获取数据

// ie. in your template you would have an input like this:
<input id="first-name" type="text" />

在模型上调用toJSON（）

var data = {
  user: model.toJSON(),
  req: "REQUSERSIGNIN",
  platform: "WEB",
}

然后你就可以照常进行了

$.ajax({
  type: "POST",
  url: "/api/element/User.php",
  data: data,
  dataType: "json",
  success: function(data) {
    console.log("you've been logged in!"
  }
});

---

谢谢但是我如何通过ajax传递这些“data:{}”参数，以便从主干中的服务器获得响应呢？更新了我的答案。有意义吗？您可以使用

fetch

。请看这篇文章。可能重复的

var data = {
  user: model.toJSON(),
  req: "REQUSERSIGNIN",
  platform: "WEB",
}

$.ajax({
  type: "POST",
  url: "/api/element/User.php",
  data: data,
  dataType: "json",
  success: function(data) {
    console.log("you've been logged in!"
  }
});