JsonResult控制器参数始终为null

Question

我正在另一种视图和控制器上使用极其相似的代码，这些视图和控制器运行良好，但由于某种原因，我无法使它正常工作。 不管我做什么，即使javascript中的名称和传递均正常运行，控制器参数仍显示未定义。 任何帮助，将不胜感激！

View:

@using (Html.BeginForm())
{
 <fieldset>
 <legend>User</legend>
       Username:
            @Html.TextBox("txtUsername")
       <br/>
       Password:
            @Html.TextBox("txtPassword")
       <br />
       <p>
            <input type="submit" id="btnLogin" value="Login" />
       </p>
 </fieldset>
 }       

 <script>

 $(function() {
      $("#btnLogin").click(login);
 });

     function login() {
         var name = $('#txtUsername').val();
         var pass = $('#txtPassword').val();

     $.post("/User/Login/" + name + "/" + pass, null, loginSuccess, "json");
}

function loginSuccess(result) {
    alert(result);
}

</script>


Controller:

public ActionResult Login()
{
    return View("Login");
}

[HttpPost]
public JsonResult Login(string name, string pass)
{
    string result = "test result";

    return Json(result);
}

Answer 1

所有你需要的是：

View:

@using (Html.BeginForm())
{
 <fieldset>
 <legend>User</legend>
   Username:
        @Html.TextBox("txtUsername")
   <br/>
   Password:
        @Html.TextBox("txtPassword")
   <br />
   <p>
        <input type="button" id="btnLogin" value="Login" />
   </p>
 </fieldset>
 }      

然后控制器：

Controller:

public ActionResult Login()
{
    return View("Login");
}

[HttpPost]
public JsonResult Login(string name, string pass)
{
    string result = "test result";

    return Json(result);
}

Ajax部分：

<script type="text/javascript">
$( "#btnLogin" ).click(function() {


$.ajax({
                url: "@Url.Action("YourControllerActionName", "YourControllerName")",
                type: 'POST',
                data: {
                    name: $('#txtUsername').val(),
                    pass: $('#txtPassword').val()
                },
                success: function(result) {
                      alert(result); 
                }
            });
});
<script>

Answer 2

您也许可以按照自己的方式进行操作，但是我也需要查看您的路线。 不过，有更好的方法进行此调用。

var data = {
    "name": $('#txtUsername').val(),
    "pass": $('#txtPassword').val()
};

$.post('@Url.Action("Login", "Home")', data, function(response) {
   //Do something with the response if you like
});

Answer 3

我不喜欢字符串连接和硬编码字符串。

首先，让我们使用HTML帮助器来解析操作的URL。

@Url.Action("Login", "User")

其次，让我们将数据作为javascript对象传递。

$.post("@Url.Action("Login", "User")",
    {
        name: name,
        pass: pass
    }, loginSuccess, "application/json");

Answer 4

您将参数作为URL的一部分发送（因此，实际上，使其成为GET而不管jquery $ .post（）），并且您的控制器严格要求使用HttpPost（即，参数位于HTTP请求正文中，而不位于查询字符串中）。

撇开在URL中使用用户名/密码这一事实是非常糟糕的做法。

尝试将数据发送为：

$ .post（'url / of / the / controller'，{name：$（'＃txtUsername'）。val（），pass：$（'＃txtPassword'）。val（）}）;

Answer 5

您正在错误地调用您的控制器操作方法。 尝试在$.post调用中传递name并作为数据pass ，而不是附加到url上。

使您的控制器操作方法采用LogIn类型的模型也可能更干净。 LogIn可以具有两个属性（ Name和Pass ）。 这样，当您在$.post发送数据时，可以像{ name: 'someName', pass: 'somePass' }一样发送数据。

Answer 6

您可以将其发布为::

    $.ajax({
           type:'POST',
           url:"User/Login",
           data:{UserName:$("#UserName").val(),Password:$("#Password").val()},
           success:function(data){
               alert(data);
           }
    })

在服务器端，您将获得以下信息：

[HttpPost]
public JsonResult Login(string Username, string Password)
{
    string result = "test result";

    return Json(result);
}