Programing

ASP.NET MVC 텍스트 상자 입력 값 가져 오기

crosscheck 2020. 11. 10. 07:50
반응형

ASP.NET MVC 텍스트 상자 입력 값 가져 오기


텍스트 상자 입력과 일부 라디오 버튼이 있습니다. 예를 들어 내 텍스트 상자 입력 HTML은 다음과 같습니다.

<input type="text" name="IP" id="IP" />

사용자가 웹 페이지의 버튼을 클릭하면 데이터를 컨트롤러로 전달하고 싶습니다.

<input type="button" name="Add" value="@Resource.ButtonTitleAdd"  onclick="location.href='@Url.Action("Add", "Configure", new { ipValue =@[ValueOfTextBox], TypeId = 1 })'"/>

사소한 것일 수도 있지만 내 문제는 텍스트 상자 값을 가져와 컨트롤러에 전달하는 방법을 모른다는 것입니다. 텍스트 상자 값을 읽고 컨트롤러에 전달하려면 어떻게해야 ipValue=@[ValueOfTextBox]합니까?


이메일 텍스트 상자가있는 간단한 ASP.NET MVC 구독 양식은 다음과 같이 구현됩니다.

모델

양식의 데이터가이 모델에 매핑됩니다.

public class SubscribeModel
{
    [Required]
    public string Email { get; set; }
}

전망

보기 이름은 컨트롤러 메소드 이름과 일치해야합니다.

@model App.Models.SubscribeModel

@using (Html.BeginForm("Subscribe", "Home", FormMethod.Post))
{
    @Html.TextBoxFor(model => model.Email)
    @Html.ValidationMessageFor(model => model.Email)
    <button type="submit">Subscribe</button>
}

제어 장치

컨트롤러는 요청을 처리하고 적절한 응답 뷰를 반환합니다.

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

    [HttpPost]
    public ActionResult Subscribe(SubscribeModel model)
    {
        if (ModelState.IsValid)
        {
            //TODO: SubscribeUser(model.Email);
        }

        return View("Index", model);
    }
}

다음은 내 프로젝트 구조입니다. "Home"뷰 폴더는 HomeController 이름과 일치합니다.

ASP.NET MVC 구조


jQuery를 사용할 수 있습니다.

<input type="text" name="IP" id="IP" value=""/>
@Html.ActionLink(@Resource.ButtonTitleAdd, "Add", "Configure", new { ipValue ="xxx", TypeId = "1" }, new {@class = "link"})

<script>
  $(function () {
    $('.link').click(function () {
      var ipvalue = $("#IP").val();
      this.href = this.href.replace("xxx", ipvalue);
    });
  });
</script>

이 시도.

전망:

@using (Html.BeginForm("Login", "Accounts", FormMethod.Post)) 
{
   <input type="text" name="IP" id="IP" />
   <input type="text" name="Name" id="Name" />

   <input type="submit" value="Login" />
}

제어 장치:

[HttpPost]
public ActionResult Login(string IP, string Name)
{
    string s1=IP;//
    string s2=Name;//
}

모델 클래스를 사용할 수 있다면

[HttpPost]
public ActionResult Login(ModelClassName obj)
{
    string s1=obj.IP;//
    string s2=obj.Name;//
}

ajax 방법을 사용하는 또 다른 방법 :

전망:

@Html.TextBox("txtValue", null, new { placeholder = "Input value" })
<input type="button" value="Start" id="btnStart"  />

<script>
    $(function () {
        $('#btnStart').unbind('click');
        $('#btnStart').on('click', function () {
            $.ajax({
                url: "/yourControllerName/yourMethod",
                type: 'POST',
                contentType: "application/json; charset=utf-8",
                dataType: 'json',
                data: JSON.stringify({
                    txtValue: $("#txtValue").val()
                }),
                async: false
            });
       });
   });
</script>

제어 장치:

[HttpPost]
public EmptyResult YourMethod(string txtValue)
{
    // do what you want with txtValue
    ...
}

아주 간단하게 할 수 있습니다.

첫 번째 : 모델의 경우이 구현에 User.cs가 있습니다.

public class User
 {
   public string username { get; set; }
   public string age { get; set; }
 } 

빈 모델을 사용자에게 전달합니다 –이 모델은 사용자가 다음과 같은 양식을 제출할 때 사용자의 데이터로 채워집니다.

public ActionResult Add()
{
  var model = new User();
  return View(model);
}

빈 사용자 별보기를 모델로 반환하면 구현 한 양식의 구조와 매핑됩니다. HTML 측에 다음과 같은 내용이 있습니다.

@model MyApp.Models.Student
@using (Html.BeginForm()) 
 {
    @Html.AntiForgeryToken()

    <div class="form-horizontal">
        <h4>Student</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group">
            @Html.LabelFor(model => model.username, htmlAttributes: new { 
                           @class = "control-label col-md-2" })
            <div class="col-md-10">
                 @Html.EditorFor(model => model.username, new { 
                                 htmlAttributes = new { @class = "form-
                                 control" } })
                 @Html.ValidationMessageFor(model => model.userame, "", 
                                            new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.age, htmlAttributes: new { @class 
                           = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.age, new { htmlAttributes = 
                                new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.age, "", new { 
                                           @class = "text-danger" })
            </div>
        </div>
        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Create" class="btn btn-default" 
                 />
            </div>
        </div>
   </div>
}

따라서 버튼 제출에서 다음과 같이 사용합니다.

[HttpPost]
public ActionResult Add(User user)
 {
   // now user.username has the value that user entered on form
 }

참고 URL : https://stackoverflow.com/questions/18873098/asp-net-mvc-get-textbox-input-value

반응형