为什么我的ajax在提交用@HtmlRenderPartial加载的表单时只调用fire一次

我有一个索引页面，我用两个局部视图加载它。在加载的每个部分视图上都有一个ajax调用，用于按日期过滤内容。问题是ajax只成功触发一次，随后的表单提交只会导致页面的完全刷新，即ajax没有触发。我将每个脚本移到一个单独的文件中，并在我在Layout页面中调用的捆绑包中引用它。再次尝试会产生相同的结果，即ajax事件只触发一次，当再次单击提交按钮时，不会发生任何事情。下面是我的代码

Index.Cshtml
@{
    ViewBag.Title = "";
    Layout ="~/Views/Shared/_Layout.cshtml";
}
<h2>TRANSACTIONS</h2>
@Html.Action("IndexGrid", "Transactions")
<h2>BREAKDOWN</h2>
@Html.Action("LoanBreakDown", "Transactions")
<div class="ajaxModal"><!-- Place at bottom of page --></div>

IndexGrid.cshtml

<form action="/transactions/index" method="post" id="filterByDate">
            <td colspan="3">
                <label>START:</label> <input type="date" name="StartDate" id="StartDate" />
            </td>
            <td colspan="3">
                <label>END:/label> <input type="date" name="EndDate" id="EndDate" />
            </td>
            <td colspan="3">
       <input type="submit" value="SEARCH" class="btn btn-default submit" />
            </td>
        </form>

LoanBreakDown.chtml

<form action="/transactions/LoanBreakDown" method="post" id="searchloan">
    START: <input type="date" name="StartDate" id="StartDate" />
    END: <input type="date" name="EndDate" id="EndDate" />
    <input type="submit" value="SEARCH" class="btn btn-default" />
</form>

GridDateFilter.js

$(document).ready(function() {
    $("#filterByDate").submit(function() {
        event.preventDefault();
        $("#TransactionTable").empty();
        $.ajax({
            type: "POST",
            url: "/Transactions/IndexGrid",
            data: $(this).serialize(),
            dataType: "html",
            success: function(data) {
                $("#TransactionTable").html(data);
            }
        });
    });
});

分解日期过滤器.js

$(document).ready(function () {
    $("#searchloan").submit(function () {
        event.preventDefault();
        //$(".loading").html("Processing your request...");
        $("#loadbreakdown").empty();
        $.ajax({
            type: "POST",
            url: "/Transactions/LoanBreakDown",
            data: $(this).serialize(),
            dataType: "html",
            success: function (data) {
                $("#loadbreakdown").html(data);
            }
        });
    });
});

GridDateFilter.js负责IndexGrid.cshtml，而BreakdownDateFilter.jss负责LoanBreakDown.chtml。请注意，这两个视图都加载到主页中，即带有@Html.RenderPartial的index.cshtml页面，脚本在调用jquery后包含在布局页面中。