如何使用 AJAX 将字符串传递给控制器

Question

当按下按钮时，我似乎无法完成将字符串传递给控制器​​的这个非常简单的任务。接收到的数据始终为空。有人能告诉我我做错了什么吗？

形式：

<form>
    <div class="form-group">
        <label for="ProcessName" class="control-control">Process Name</label>
        <input id="ProcessName" class="form-control" placeholder="Choose process name">
        <small id="subtitle" class="form-text text-muted">Text under input field.</small>
    </div>
    <button type="submit" class="btn btn-primary" id="addElement">Submit</button>
</form>

Javascript：

$(function () {
    $("#addElement").click(function () {
        var processName = $("#ProcessName").val();

        // I've tried this method
        $.post('@Url.Action("AddProcessName")', processName, function (data, status) {
                    alert(data)
        });

       // And also this one, but both of them don't work.
       // I did not try them at the same time, of course
        $.ajax({
            type: "POST",
            url: '@Url.Action("AddProcessName")',
            data: processName,
            dataType: 'text',
            success: function (response) {
                alert(response)
                };
        });
    });
});

服务器端：

[HttpPost]
public IActionResult AddProcessName(string data)
{
    pm.ID = 1;
    pm.Name = data; // I put a breakpoint here to check the value of 'data'
    return Content(pm.Name);
}

Answer 1

你告诉你的 Action 期待一个名为 的变量data，但你没有发送它。您需要将datajQuery AJAX 请求的属性更改为：

data: { data: processName },

我还建议您从 Action 返回 JSON，因为由于空格可能会或可能不会被解释的方式，纯文本充其量可能是片状的。尝试这个：

data: { data: processName },

$("#addElement").click(function () {
  $.ajax({
    type: "POST",
    url: '@Url.Action("AddProcessName")',
    data: { 
      data: $("#ProcessName").val() 
    },
    dataType: 'json',
    success: function(response) {
      // use console.log for debugging, and access the property of the deserialised object
      console.log(response.Name); 
    };
  });
});