Question

我目前正在为WebAPI进行Pluralsight培训并遇到一些问题（下载这些示例并没有帮助，因为它们也不起作用 - 该课程是在Beta版本之外创建的，我使用的是最终版本与.Net 4.5）。我用以下HTML创建了一个非常简单的视图：

<form onsubmit="return submitCourse();">
     <input type="text" name="name" id="name" />
     <input type="submit" value="Create Course" />
</form>
<h1 id="msg"></h1>
<script>

//1: have form - get values from form - send to API as json
//2: use form values

function submitCourse() {

    //$.ajax({
    //    url: '/api/courses',
    //    type: 'POST',
    //    dataType: 'json'
    //});

    $.ajax({
        url: '/api/courses/',
        type: 'POST',
        dataType: 'json',            
        success: function (newCourse) {
            var msg = 'New course id = ' + newCourse.id;
            $('#msg').text(msg);
        }
    });

    return false;
}

</script>

应该发生的是当表单提交时，脚本首先运行，表单数据通过AJAX调用传输给我。我遇到的问题是当我的控制器中的Post方法被命中时，“newCourse”参数始终为null：

    public Course Post(Course newCourse)
    {
        newCourse.id = _courses.Count;
        _courses.Add(newCourse);

        //TODO : return 201
        return newCourse;
    }

通过各种工具挖掘，我发现上面的脚本似乎根本没有发送数据（内容长度为0），但我似乎无法弄清楚为什么（WebAPI和jQuery的$ .ajax新手）（）致电）。我尝试使用$ .ajax（）调用中的“data”选项显式设置对表单值的调用主体（如下所示： data：{'name'：$（'＃name'） .text（）} ），但这也没有做太多。内容长度似乎发生了变化（为5，不确定原因）但值仍未被反序列化。

任何提示？我对这两种技术都不熟悉，不知道从哪里开始。

Answer 1

您需要使用$ .ajax（）中的数据选项将数据发布到API。您可以使用数据：$（“＃CourseForm”）。serialize（），如果您将id“CourseForm”提供给表单，并确保表单内的输入字段的名称与Course的属性名称匹配，以便绑定到工作

Web API未序列化

1 个答案: