javascript mvc 和 ajax 表单提交

Question

我刚刚开始研究 javascript 客户端上的 mvc ( JavaScript MVC )。一切看起来都很棒，直到我提交表单:) View 部分不会这样做，这很简单。事件附加在 Controller 中，因此 Controller 是验证表单数据的好地方，但我不确定我是否希望我的 Controller 知道特定的服务器地址(要发布我的表单)，所以在模型中拥有一个方法会很棒，但我不希望我的模型知道我的表单(实际上是 html 结构......)。

那么，我对 MVC 概念怀念什么？我也不确定是否要在 Controller 中序列化我的表单，然后将其作为参数传递给我的模型。目前，我认为使模型独立的唯一选择是拥有 JavaScript 结构(实体)，该结构将由 Controller 填充(基于表单数据)，并将传递给模型方法以保存在服务器上。非常简化的代码:

Info = {
    name,
    address,
    // 15 more properties
    ...
}

InfoController = {
    ...
    onFormSubmit: function() {
       ... 
       info.name = document.getElementById("info-name").value;
       info.adress = document.getElementById("info-address").value;
       ...
       InfoModel.save( info );
    }
}

InfoModel = {
    ...
    save: function( info ) {
        // here some code to setialize info object 
        // send it to server
        ...
    }
}

但这使我的代码过于复杂(与某些侧面框架的简单形式序列化相比，然后只是发送它......)。什么是正确的选择？

Answer 1

只是回答我自己的问题。简短的回答 - 是的，我的假设是对的；)我看了一下JavaScriptMVC ，并注意到我错过了一件简单的事情，可以开发一个简单的函数，它将创建基于表单的 javascript 对象(它们有一个名为 formParams 的函数，它执行这种类型的转换)。这样我的 Controller 就被简化了:

InfoController = {
    ...
    onFormSubmit: function() {
       ... 
       var info = $infoForm.formParams();
       InfoModel.save( info );
    }
}

现在看起来并不那么复杂，它的优点是有一个地方(模型)知道如何保存数据(验证；发送的 url；其他一些东西，例如将此实体添加到客户端“存储”；触发一个将要创建新内容的事件；根据我们的需要进行其他任何操作)，如果我还有一个地方或控制流再次执行此操作，我将不会再次编写此代码，并且它不依赖于关于演示(是形式，还是只是一组输入、向导等)。模型也变得非常可重用。

实际上，在使用这种方法之前，我们有类似的东西，但它不是那么结构化(在我的可以运行 JavaScript 的应用程序的不同演示文稿中)。