jquery - POST Json 到 Razor 页面

标签 jquery .net ajax post asp.net-core

我是 .Net 核心中的 razor 页面的新手,我很难理解它在 AJAX Post 的情况下是如何工作的。

我创建了一个示例项目来解释我的问题

我有一个简单的表单,在一个名为 Index.cshtml 的文件中包含三个输入:

<form method="post">
    firstname :
    <input id="firstname" type="text" name="firstname" />
    name:
    <input id="name" type="text" name="name" />
    message:
    <input id="message" type="text" name="message" />

    <input type="submit" value="Submit">
</form>

<script src="~/lib/jquery/dist/jquery.js"></script>
<script>
    $(document).ready(function(){
        $("form").submit(function () {
            var message = {
                firstname: $("#firstname").val(),
                name: $("#name").val(),
                message: $("#message").val()
            }

            $.ajax({
                url: "/Index",
                type: "POST",
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                data: JSON.stringify(message),
                success: function () {
                    console.log("success")
                },
 
            });
        })
    });
</script>


我想将我的 json 对象(消息)发送到我在 PageModel 中的 OnPost() 函数:

    public class IndexModel : PageModel
    {
        public void OnGet()
        {

        }

        public void OnPost(string json)
        {
            Console.WriteLine(json);
        }
    }


问题是它是空的,

我也尝试过:
data: { "json" : JSON.stringify(message) },
但是在我的 OnPost 方法中,json 始终为 null。

你能解释一下我的错误在哪里吗?

谢谢

最佳答案

这是一个关于模型绑定(bind)的问题。当您将数据发布为 Json 时,收到的数据是一个 json 对象,如 {"firstName":"Andrew","name":"Lock","message":"Hello"} .

因此,您应该在处理程序中使用模型消息作为参数,为了在 ASP.NET Core 中正确绑定(bind) JSON,您必须修改您的操作以在参数上包含属性 [FromBody]。

你可以看看Model binding JSON POSTs in ASP.NET Core .

关于jquery - POST Json 到 Razor 页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54408628/

相关文章:

javascript - Bootstrap 工具提示将我右侧的内容推开

c# - 阻止 System.Net.IPAddress 类中的混合 IPv6 格式

c# - 来自开放 API 的 .Net 解析器 JSON

ajax - Vue JS Ajax 调用

javascript - 使用 AJAX 自动加载第二个下拉列表

javascript - 手机下滑效果

javascript - 使用 jQuery 的功能 promise

c# - 目标框架是如何工作的(以及为什么 2.0 的 lib 可以使用 4.0 的 lib)?

javascript - Alert() 的警报超出预期

javascript - 将 Jquery 列表值分配给文本按钮