0

ユーザーにIDを尋ねるWebフォームがあります。私の全体的な目標は、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;
    }
}
4

4 に答える 4

2

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>
于 2012-09-24T11:18:46.750 に答える
1

最も簡単な方法は、おそらくアクションに対して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);
}
于 2012-09-24T11:17:47.233 に答える
1

フォーム タグは、ユーザーがフォームを送信したときに POST が送信される場所を決定するタグです。あなたは現在持っています:

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

これにより、POST が現在のアドレスに転送されます。

MVC フォーム ヘルパーを使用して、これを簡単に変更できます。

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

または、正しい URL または URL ヘルパーを使用して手動でクランキングすることもできます。

URL ヘルパー

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

手回し

<form id="searchUser" method="post" action="/Search/searchUser/">
于 2012-09-24T11:21:34.903 に答える
1 
$(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);
}
于 2012-09-24T11:22:42.943 に答える