javascript - 在视图中从 Javascript 调用控制器的方法

Question

我正在尝试通过 Javascript 从 View 访问控制器中的方法

<div id="Historicaldata">
    From Date <input type="date" id="fromDate" /> To Date <input type="date" id="toDate" />
    <a href="#" id="ExportExcel" onclick="GetFromDate()">Export to Excel</a>
</div>

<script>
    function GetFromDate() {

        var dt1 = document.getElementById('fromDate').value;
        var dt2 = document.getElementById('toDate').value;
        var url = "~/GeneralStatics/Excel/" + "startdate=" + dt1 + "/endDate=" + dt2;
        alert(url);

            window.location.href = this.href + "startDate=" + document.getElementById('fromDate').value + "&endDate=" + document.getElementById('toDate').value;
            return false;

    };
</script>

在我的控制器中有这样的避免方法：

 public void Excel(DateTime startDate, DateTime endDate)

将下载 Excel 文件。做这个的最好方式是什么？是否可以在没有重定向的情况下做到这一点？

Answer 1

您不需要 javascript，您可以将输入字段放在 HTML 表单中：

@using (Html.BeginForm("Excel", "SomeControllerName", FormMethod.Post))
{
    <div id="Historicaldata">
        From Date <input type="date" name="startDate" /> 
        To Date <input type="date" name="endDate" />
        <button type="submit">Export to Excel</button>
    </div>
}

还要确保您的操作参数与输入字段的名称匹配，并且不要忘记在 ASP.NET MVC 中，控制器操作必须返回 ActionResults，而不是 void：

public ActionResult Excel(DateTime startDate, DateTime endDate)
{
    ...
}

Answer 2

使用 AJAX 下载文件：

$.ajax({
     url: '@Url.Action("Excel", "GeneralStatics")',
     contentType: 'application/json; charset=utf-8',
     datatype: 'json',
     type: "GET",
     success: function () {
         window.location = '@Url.Action("Excel", "GeneralStatics", new { @startDate= dt1 , @endDate =  dt2 })';
     }
 });