Jquery数据表正确显示然后重置

时间:2016-06-01 10:43:57

标签: jquery jquery-plugins datatables

我有一个新的MVC项目,我将Jquery DataTables的CDN版本添加到_layout页面,当页面显示正确然后重置时我很难过,我添加了runonce表示法,但这没有帮助。

$(document).ready(function () {
    $("#getViewReportButton").off("click.runonce1").on("click.runonce1", function () {
        alert("drop down = " + $('#ReportSelected').find(":selected").text());
        viewReports($('#ReportSelected').find(":selected").val());
    });
});

function viewReports(reportSelected) {
    var controller = "PortalReports";
    alert("View Reports = " + reportSelected);
    var tableSelector = "#dataPortalTable";

    var table = $(tableSelector).DataTable({
        "ajax": {
            "url": $("#basePath").val() + controller + "/GetReport",
            "type": "POST"
        },
        "columns": [
            { "data": "MiPolicyTransactionId" },
            { "data": "CompanyId" },
            { "data": "AgencyCode" }]

    });
}

在此正确呈现 Correctly rendered here

但请重置 but reset here

我可以在哪里放置断点来调试它?或者是否有任何其他建议请找不到可能导致此问题的任何内容?

修改 Chrome控制台,其中保留日志已选中,确认导航至... Edit - Chrome console output

只有jquery和jquery.datatables仍然一样,请看下面的head标签!!!!!!

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - My ASP.NET Application</title>
    @*@Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
    @Scripts.Render("~/bundles/jquery")*@
    @* @Scripts.Render("~/bundles/jqueryui")
    @Scripts.Render("~/bundles/jqueryval")
    @Scripts.Render("~/bundles/dataTables")
    @Scripts.Render("~/bundles/bootstrap")
    @RenderSection("pageScripts", required: false)*@
    <script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script>
    @*<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css">*@
    <script type="text/javascript" language="javascript" src="//cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>

</head>

1 个答案:

答案 0 :(得分:0)

<form  id="reportForm" method="post">
    <div class="fieldRow ui-widget-content ui-corner-all">
        <div class="field">
            @Html.DropDownListFor(x => x.ReportSelected, Model.ReportOptions, "Please Select")
            <input id="getViewReportButton" type="submit" value="View Report" />
            <span id="searchLoader" class="ajaxLoader"></span>
        </div>
    </div>
</form>

<input id="getViewReportButton" **type="submit"** value="View Report" />//submit still firing
<input id="getViewReportButton" **type="button"** value="View Report" />//No action

该按钮在jquery之后提交并重置页面!!!!