Question

我有一个网络表单，询问用户他们的ID。我的总体目标是能够获取id并调用函数并返回一个类。该类将返回用户名，电子邮件和城市。我还没那么远。我还在第一阶段。

我的HTML代码是否正确？按下按钮时，我希望用户输入传递给控制器？

我想从html中的输入文本中获取文本。我想从我的html表单中的输入中接收文本。然后将该文本带到控制器，该控制器调用用户类并显示该类

<html>
       <div align="center">
        <form id="searchUser" method="post" action="">
            <table align="center">
        <tr>
            <td class="label">
           Enter ID:
             </td>
            <td>
                <input type="text" name="UserId" id="UserId" />
            </td>
        </tr>
        <tr>
            <td>
                <button class="searchButton" id="searchButtong">Search</button>
            </td>
        </tr>
      </table>
     </form>
   </div>
   <hr /> 
</html>


Search Controller

 public class SearchController : Controller
{
    //
    // GET: /Search/

    public ActionResult Index()
    {
        return View();
    }

    public string searchUser(string UserId)
    {
        UserId = Request["UserId"];
        return UserId;
    }
}

Answer 1

您已在控制器操作中声明了UserId变量。您无需再次从Request获取它：

public class SearchController : Controller
{
    public ActionResult Index()
    {
        return View();
    }

    [HttpPost]    
    public ActionResult SearchUser(string UserId)
    {
        User user = ... go and fetch the user given the user id 
        // from wherever your users are stored (a database or something)
        return View(user);
    }
}

现在，您可以将视图强烈输入到User类，并有一个显示结果的部分：

<%@ Page 
    Language="C#" 
    Inherits="System.Web.Mvc.ViewPage<MvcApplication1.Models.User>"
%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Demo</title>
</head>
<body>
   <div align="center">
        <% using (Html.BeginForm("SearchUser", "Search")) { %>
            <table align="center">
                <tr>
                    <td class="label">
                        Enter ID:
                    </td>
                    <td>
                        <input type="text" name="UserId" id="UserId" />
                    </td>
                </tr>
                <tr>
                    <td>
                        <button class="searchButton" id="searchButtong">Search</button>
                    </td>
                </tr>
            </table>
        <% } %>
    </div>

    <hr /> 

    <% if (Model != null) { %>
        <!-- Display the User results here -->
        <div>
            <%= Html.DisplayFor(x => x.FirstName) %>
        </div>
        <div>
            <%= Html.DisplayFor(x => x.LastName) %>
        </div>
    <% } %>
</body>
</html>

现在您已经使用标准HTML技术实现了此功能，您可以通过引入AJAX来改进它：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Demo</title>
</head>
<body>
    <div align="center">
        <% using (Ajax.BeginForm("SearchUser", "Search", null, new AjaxOptions { UpdateTargetId = "results" })) { %>
            <table align="center">
                <tr>
                    <td class="label">
                        Enter ID:
                    </td>
                    <td>
                        <input type="text" name="UserId" id="UserId" />
                    </td>
                </tr>
                <tr>
                    <td>
                        <button class="searchButton" id="searchButtong">Search</button>
                    </td>
                </tr>
            </table>
        <% } %>
    </div>

    <hr /> 

    <div id="result"></div>

    <!-- TODO: Adjust with the proper version of jQuery that you are using -->
    <script src="<%= Url.Content("~/Scripts/jquery-1.7.1.min.js") %>" type="text/javascript"></script>
    <script src="<%= Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js") %>" type="text/javascript"></script>
</body>
</html>

然后让控制器操作返回PartialView：

[HttpPost]    
public ActionResult SearchUser(string UserId)
{
    User user = ... go and fetch the user given the user id 
    // from wherever your users are stored (a database or something)
    return PartialView(user);
}

您需要定义（~/Views/Search/SearchUser.ascx）：

<%@ Control 
    Language="C#" 
    Inherits="System.Web.Mvc.ViewUserControl<mVCaPPLICATION1.mODELS.uSER>" 
%>
<!-- Display the User results here -->
<div>
    <%= Html.DisplayFor(x => x.FirstName) %>
</div>
<div>
    <%= Html.DisplayFor(x => x.LastName) %>
</div>

Answer 2

最简单的方法可能是对操作发出AJAX请求，并让操作以JSON格式返回正确的数据。

public JsonResult YourActionName(int id)
{
    // Fetch your data from DB, or create the model
    // in whatever way suitable
    var model = new YourModel {
        UserName = "Something"
    };

    // Format the response as JSON
    return Json(model);
}

Answer 3

您的表单标签用于确定用户提交表单时POST的去向。你现在有：

<form id="searchUser" method="post" action="">

这会将POST指向当前地址。

您可以使用MVC表单助手轻松更改此内容：

@using (Html.BeginForm()) {
    //Your form here
}

或者您可以使用正确的URL或URL帮助程序手动启动它。

网址助手

<form id="searchUser" method="post" action="@Url.Action("searchUser", "Search")">

手持曲柄

<form id="searchUser" method="post" action="/Search/searchUser/">

Answer 4

$(function(){
  $("#searchButtong").click(function(e){
    e.preventDefault();
    var usrId=$("#UserId").val();
    $.getJSON("@Url.Action("searchUser","search")/"+usrId,function(data){
        //here you may set this to a div in the dom instead of alerting.
        alert(data.UserName);
        alert(data.UserID);
    });
  });
});

假设你有动作返回像这样的JSON

public ActionResult searchUser(int id)
{
  UserEntity user=repo.GetUserFromID(id);
  return Json(new { UserName=user.UserName, ID=id},
                                                JsonRequestBehaviour.AllowGet);
}

如何获取用户输入以在我的mvc控制器中命中某个方法？

4 个答案: