获取 html 5 个日期输入字段并传递给 .net 控制器

Question

在我的剃须刀页面上，我有一个简单的日期选择器，如下所示：

<input type="date" name="lessonsStart">

我将如何获取它的值并将其发送到我的控制器？

每当我从 razor 页面向我的控制器发送数据时，格式总是如下所示：

<a asp-action="LessonIndex" asp-route-id="@item.Id">@Html.DisplayFor(modelItem => item.Name)</a>

它向我的名为 LessonIndex() 的控制器发送一个 "item.Id"。

所以我不确定如何获取日期值并发送它。

控制器看起来像这样：

public IActionResult LessonIndex(datetime startDate) {

    var response = getLessons(startDate);

      return response.Results;
   }

我需要使用特定格式吗？

请注意，模型中不使用日期，只需将其发送到控制器即可。

谢谢！

Answer 1

    <div class="demo-section k-content">
    <h4>Remind me on</h4>
@(Html.Kendo().DateTimePicker()
        .Name("datetimepicker")
        .Value(DateTime.Now)
        .HtmlAttributes(new { style = "width: 100%", title = "datetimepicker" })
        .DateInput()
)
</div>

Answer 2

假设这与 mvc 有关，控制器将有一个与 post 关联的方法，您将执行该方法以将数据从表单返回到控制器。这使用 javascript 到 post 数据到您的 LessonIndex() 方法。

<!--top of your page.-->
@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf
@functions{
    public string GetAntiXsrfRequestToken()
    {
        return Xsrf.GetAndStoreTokens(Context).RequestToken;
    }
}

<input type="date" id="lessonStart" name="lessonStart" />
<input type="Submit" id="PostButton" name="PostButton" Value="Go" />

@section Scripts{ // razor section at the bottom of mvc page 'cshtml'.
<script type="javascript">
 $(function(){   
   $("#PostButton").click(function(){
      var url = '@Url.Action("LessonIndex", "Lesson")';  //assuming controller is named Lesson
       var date= new Date(this.value).ToDateString();
      $.ajax({
        url: url, 
        type: "POST",
        data: "lessonStart=" + date,
        headers:{
        "RequestVerificationToken": '@GetAntiXsrfRequestToken()'
        },
        success: function(response){
           console.log(response);
        },
        error: function(e){
          console.log(e.error);
        }
      });
   });
 }
</script>
}

这还假设该方法看起来像这样


public class LessonController : Controller{

 [HttpPost]
 [AutoValidateAntiforgeryToken]
 public IActionResult LessonIndex(DateTime lessonStart){
          var response = getLessons(lessonStart);
    return View(response.results);
 }

}

Answer 3

" 请注意，模型中不使用日期，只需将其发送到控制器即可。"

您可以使用 ajax 将日期作为 QueryString 传递给控制器中的方法。

这里是测试例子

<input type="date" name="lessonsStart" id="lessonsStart">

@section Scripts
{
<script type="text/javascript">
    $("#lessonsStart").change(function () {
        var inputDate = new Date(this.value).toDateString();
        $.ajax({
            type: "post",
            url: "/ControllerName/lessonindex?startdate=" + inputDate,
            success: function () { }
        });
    });

</script>
}

控制器中的方法

 [HttpPost]
    public IActionResult LessonIndex(DateTime startDate)
    {

        return Json(startDate);
    }

获取 html 5 个日期输入字段并传递给 .net 控制器

get html 5 date input field and pass to .net controller

razor

asp.net-core-mvc

asp.net-core-2.0