代码之家 › 专栏 › 技术社区 › SkyeBoniwell

获取HTML 5日期输入字段并传递到.NET控制器

asp.net-core-2.0 asp.net-core-mvc razor

SkyeBoniwell · 技术社区 · 6 年前

在我的Razor页面上,我有一个简单的日期选择器,如下所示:

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

我该如何获取它的值并将其发送给我的控制器?

每当我从Razor页面向控制器发送数据时,格式总是如下所示:

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

它将“item.id”发送到我的控制器lessonIndex()。

所以我不知道如何得到日期值并发送它。

控制器如下:

public IActionResult LessonIndex(datetime startDate) {

    var response = getLessons(startDate);

      return response.Results;
   }

我需要使用特定的格式吗?

请注意,模型中没有使用日期,它只需要发送到控制器。

谢谢!

3 回复 | 直到 6 年前

mvermef 6 年前

假设这与MVC相关,那么控制器将拥有一个与POST相关联的方法,您可以执行该方法将表单中的数据返回到控制器。它使用javascript将数据发布到 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);
 }

}

Xueli Chen 6 年前

请注意,模型中没有使用日期,它只需要发送到控制器。

可以使用Ajax将日期作为查询字符串传递给控制器中的方法。

下面是测试示例

<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);
    }

-1

Priyanka Chopra 6 年前

    <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>