首页 > 解决方案 > 如何使用json将数据传递给ajax函数?

问题描述

我需要从 URL 中获取 id,从文本框中获取注释值,将其保存到数据库并使用 ajax 显示在页面上。我不确定在我的控制器和 ajax 函数中应该如何看待正确的语法。

控制器

 [HttpPost]
    public JsonResult AddComment(int id, string comment)
    {
        if (ModelState.IsValid)
        {
            return Json(true); // what should be here 
        }
        return Json(true);
    }

阿贾克斯

    $('#submit').click(function () {
        $.ajax({
            url: '/Form/AddComment',
            method: 'POST',
            data: {
                id: 4,               //how to get id from url?
                comment: 'test'      //how to get textbox value?
            },
            success: function (data) {
                console.log(data)
            },
            error: function (a, b, c) {
                console.log('err')
            }
        })
    });

这只是告诉我它有效,但我不知道如何前进

标签: c#jqueryjsonajaxasp.net-mvc

解决方案


根据您的要求,您必须在客户端进行适当的表单处理才能获得变量,如idcomment。您可以使用强类型模型绑定来获取表单值并在提交时处理它们,或者您可以使用 JavaScript 技术来处理表单变量。要从 URL 中提取出来id,您可以使用一种Regular Expression或其他 JavaScript 字符串解析技术。我给你一个简单的例子,使用 JavaScriptid从 URL 和文本框中获取你的:comment

您的输入控件如下所示:

<input type="text" id="commentBox" name="Comment" class="form-control" />

为了使用 AJAX 将表单变量发布到控制器来实现您想要的功能,请参阅以下代码片段:

阿贾克斯:

<script type="text/javascript">

var url = 'http://www.example.com/4'; //Example URL string
var yourid = url.substring(url.lastIndexOf('/') + 1);
var yourcomment= document.getElementById('commentBox').value;

var json = {
            id: yourid, //4
            comment: yourcomment 
           };

$('#submit').click(function (){
    $.ajax({
        url: '@Url.Action("AddComment", "Form")',
        type: "POST",
        dataType: "json",
        data: { "json": JSON.stringify(json)},
        success: function (data) {
         console.log(data)
         },
         error: function (data) {
         console.log('err')
         },
    });
};
</script>

您可以像这样在 Controller 中获取您的值:

using System.Web.Script.Serialization;

[HttpPost]
public JsonResult AddComment(string json)
{
    if (ModelState.IsValid)
    {
        var serializer = new JavaScriptSerializer();
        dynamic jsondata = serializer.Deserialize(json, typeof(object));

        //Get your variables here from AJAX call
        string id= jsondata["id"];
        string comment=jsondata["comment"];

        // Do something here with your variables. 
    }
    return Json(true);
}

推荐阅读