如何將輸入作爲參數提供給MVC5中的操作方法？

Question

我有一個MVC5應用程序，我有這樣的定義的視圖模式：

public class RequestViewModel 
{ 
    [Required(ErrorMessage = "Please select a state")] 
    [Display(Name = "State")] 
    public int StateID { get; set; } 

    [Required(ErrorMessage = "Please enter a zip code")] 
    [Display(Name = "Zip")] 
    public string ZipCode { get; set; } 

    [Required(ErrorMessage = "Please choose a service")] 
    [Display(Name = "Service")] 
    public string ServiceName { get; set; } 

    public byte[] ImageData { get; set; } 

    public string ImageMimeType { get; set; } 

    public byte[] VideoData { get; set; } 

    public string VideoMimeType { get; set; } 
} 

我打電話這個視圖模型，從這樣的定義的操作：

public ActionResult ServiceRequest(RequestViewModel rvm, HttpPostedFileBase image = null, HttpPostedFileBase video = null) 
{ 
    ... 
} 

因此，要點是，在我的_Layout.cshtml文件中，我有兩個輸入字段和一個「a href」，事情是當某人按下包含href的對象時，我想要輸入這兩個字段，並調用上述行動方法。這是來自我的_Layout.cshtml的部分。

<div class="input-top"> 
    <a href='@Url.Action("ServiceRequest", "Home", new { rvm.ZipCode = homeZipCode, rvm.ServiceName = homeService })'><img src="~/Content/img/GOBtn.png" class="gobtn-position"></a> 
    <input id="homeZipCode" type="text" class="form-control input-position-2" placeholder="ZIP"> 
    <input id="homeService" type="text" class="form-control input-position-1" placeholder="What do you need done today?"> 
</div> 

我寫了這樣一個代碼，但它顯示了我的錯誤在新{ rvm.ZipCode = homeZipCode, rvm.ServiceName = homeService }的一部分，我可以看到的一點是，RVM是不是在我_Layout.cshtml文件的任何地方定義，因此，它無法解析ZipCode和ServiceName屬性。任何想法，我如何將這兩個輸入字段的值傳遞給我的操作方法？

Answer 1

請嘗試以下代碼標籤a

<a href='@Url.Action("ServiceRequest", "Home", new { homeZipCode = Model.ZipCode, homeService = Model.ServiceName })'><img src="~/Content/img/GOBtn.png" class="gobtn-position"></a> 

'rvm' has no meaning here.... 

Answer 2

您必須對您的輸入，比如添加name屬性：

<div class="input-top"> 

<input id="homeZipCode" name="ZipCode /*Your property Name*/" ...> 
<input id="homeService" name="ServiceName" ...> 
<input type="submit" value="ServiceRequest"> 
</div> 

或者使用HTML輔助它

@using (Html.BeginForm()) 
{ 
    @Html.TextBoxFor(model => model.ZipCode) 
    @Html.TextBoxFor(model => model.ServiceName) 
    <input type="submit" value="ServiceRequest"> 
} 

Answer 3

我想您可以爲錨標籤定義點擊處理程序，並將數據傳遞給Ajax請求。這會更容易。

因此，例如：

• 控制器：

  public class ServiceController : Controller { 
  
  public ActionResult ServiceRequest() 
  { 
      return View(); 
  } 
  
  [HttpPost] 
  public ActionResult ServiceRequest(RequestViewModel rvm, HttpPostedFileBase image = null, HttpPostedFileBase video = null) 
  { 
      throw new NotImplementedException(); 
  }} 
  

• 樣品查看

@{ 
    ViewBag.Title = "Index"; 
} 

<script src="~/Scripts/jquery-1.8.2.min.js"></script> 

<div class="input-top"> 
    <a class="Gobtn" href="#"><img src="~/Content/themes/base/images/ui-bg_flat_0_aaaaaa_40x100.png" /></a> 
    <input id="homeZipCode" type="text" class="form-control input-position-2" placeholder="ZIP"> 
    <input id="homeService" type="text" class="form-control input-position-1" placeholder="What do you need done today?"> 
</div> 

<script> 

    $(document).ready(function() { 
     $('a.Gobtn').on('click', function (e) { 

      e.preventDefault(); 
      alert('here in'); 

      debugger; 
      // Send an ajax post request with data 

      var homeZipCode = $("#homeZipCode").val(); 
      var homeService = $("#homeService").val(); 

      var model = { ZipCode: homeZipCode, ServiceName: homeService }; 

      $.ajax({ 
        url: '@Url.Action("ServiceRequest", "Service")', 
        contentType: 'application/json; charset=utf-8', 
        type: 'POST', 
        dataType: 'html', 
        data: JSON.stringify(model) 
       }) 
       .success(function(result) { 
       }); 
     }); 
    }); 

</script>