Question

我正在尝试使用Sammy创建SPA应用程序。当我调用＃/ entitycreate链接时，我从Home控制器返回一个部分视图，其中包含要提交的html表单。部分视图正如我所料，但其余部分不起作用。以下是我的问题和疑问，我很感激您的帮助。

KO绑定在局部视图中不起作用，即使我在默认的SPA项目模板中完成了它的完成（参见home.viewmodel.js）。
这个是最关键的：当我使用ajax / post将此表单提交给我的API时，我的模型总是返回一个空值，因此我无法通过我的API创建实体。我试过[FromBody]而没有，模型总是为空。
从某种意义上说，一般来说，我应该在我的表单中包含Html.AntiForgeryToken（）和在我的API操作中包含[ValidateAntiForgeryToken]属性吗？

部分视图：

@model namespace.SectorViewModel
<!-- ko with: sectorcreate -->
<div class="six wide column">
    <div class="ui segments">
        <div class="ui segment">
            <h4 class="ui center aligned header">Create New Sector</h4>
        </div>
        <div class="ui secondary segment">
            <form id="entity-create-form" class="ui form" action="#/sectorcreatepost" method="post" data-bind="submit: createEntity">
                <!-- I am not sure if I should include AntiForgeryToken for WebAPI call -->
                <!-- Html.AntiForgeryToken() -->
                <fieldset>
                    <div class="field required">
                        @Html.LabelFor(m => m.Name)
                        @Html.TextBoxFor(m => m.Name, new { data_bind = "value: name" })
                    </div>
                    <div class="ui two buttons">
                        <button class="ui positive button" type="submit">Create</button>
                        <button class="ui button" type="button" id="operation-cancel">Cancel</button>
                    </div>
                </fieldset>
            </form>
        </div>
    </div>
</div>
<!-- /ko -->

JS View Model：

function SectorCreateViewModel(app, dataModel) {
    var self = this;

    self.name = ko.observable("ko binding doesn't work");
    self.createEntity = function () {
        console.log("ko binding doesn't work");
    }

    Sammy(function () {
        this.get("#sectorcreateget", function () {
            $.ajax({
                url: "/home/getview",
                type: "get",
                data: { viewName: "sectorcreate" },
                success: function (view) {
                    $("#main").html(view);
                }
            });
            return false;
        });

        this.post("#/sectorcreatepost",
            function () {
                $.ajax({
                    url: "/api/sectors",
                    type: "post",
                    data: $("#entity-create-form").serialize(),
                    contentType: "application/json; charset=utf-8",
                    success: function (response) {
                        console.log(response);
                    },
                    error: function (xhr, status, error) {
                        console.log(xhr);
                        console.log(status);
                    }
                });
                return false;
            });

        this.get("#/yeni-sektor", function () {
            this.app.runRoute("get", "#sectorcreateget");
        });
    });

    return self;
}

app.addViewModel({
    name: "SectorCreate",
    bindingMemberName: "sectorcreate",
    factory: SectorCreateViewModel
});

API行动：

public HttpResponseMessage Post([FromBody]SectorViewModel model)
{
    // model is always null, with or without [FromBody]
    if (!ModelState.IsValid)
        return Request.CreateResponse(HttpStatusCode.BadRequest);

    // repository operations...

    return response;
}

Answer 1

我已根据文章here从ajax请求中删除了kwargs.setdefault('extra', {}).update({'session_id': self.session_id})。＃2现已解决，＃1和＃3仍有待回答。

从局部视图到API的表单发布

1 个答案: