微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

jquery – 使用knockout.js从表单中获取或发送数据

Knockout中的新手,也是前端设计师所以我需要简单的谈话.

我有一个表单,我需要发送到数据库,然后从数据库中检索.

请用非常简单的术语解释如何制作一个工作示例来说明保存和发布表单?

来自淘汰赛教程:http://knockoutjs.com/documentation/json-data.html
我了解获取和发送json数据.如何将json数据与表单匹配?什么是映射,是否有插件或简单示例如何将json数据映射回我的表单?基本上,我如何在下面的淘汰代码示例中做出评论

获取数据:

$.getJSON("/some/url",function(data) {
    // Now use this data to update your view models,// and Knockout will update your UI automatically
})

发送数据:

var data = /* Your data in JSON format - see below */;
$.post("/some/url",data,function(returnedData) {
    // This callback is executed if the post was successful    
})

解决方法

简单的形式
<form data-bind="submit: onSubmit">
    <input data-bind="value : firstName"/>
    <input data-bind="value : lastName"/>
    <input type="submit" text="Submit!"/>
</form>
Response: <span data-bind="text : response"></span>

简单的视图模型

var viewmodel = new function()
{
    var self = this;
    self.firstName = ko.observable("default first");
    self.lastName = ko.observable("default last");
    self.responseJSON = ko.observable(null);
    self.onSubmit = function() 
    {
        var data = JSON.stringify(
            {
                first : self.firstName(),last : self.lastName()        
            }); // prepare request data
        $.post("/echo/json",function(response) // sends 'post' request
        {
            // on success callback
            self.responseJSON(response);
        })
    }
}

ko.applyBindings(viewmodel);

JSFiddle DEMO

原文地址:https://www.jb51.cc/jquery/177632.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐