C# datatables插件中的AJAX请求在我的代码的每个部分都不起作用

C# datatables插件中的AJAX请求在我的代码的每个部分都不起作用,c#,jquery,ajax,url,datatable,C#,Jquery,Ajax,Url,Datatable,我正在一个项目中使用ASP.NETMVC5、jquery和datatables插件。我的目标是使用datatables的服务器端函数来检索数据库的数据,然后在datatable中显示dat。这在我的代码中的一部分工作得很好。在这里,您可以看到我使用datatables插件的jquery代码: var problemTable = $('#ProblemTable').DataTable({ processing: true, // show message while querying

我正在一个项目中使用ASP.NETMVC5、jquery和datatables插件。我的目标是使用datatables的服务器端函数来检索数据库的数据,然后在datatable中显示dat。这在我的代码中的一部分工作得很好。在这里,您可以看到我使用datatables插件的jquery代码:

var problemTable = $('#ProblemTable').DataTable({
    processing: true,  // show message while querying fro data
    serverSide: true,
    ajax: {
        url: "/OverView/LoadProblems"
    }
});
如下图所示,请求成功,我的数据表在网站中得到了应有的填充

请求URL如下所示:

$('.DeleteEntity').click(
function () {
    try 
    {
        var deleteTable = $('#DeleteTable').DataTable({
            processing: true,
            serverside: true,
            destroy: true,
            ajax: {
                url: "/Administration/ShowEntriesDelete"
            } 
        });
    }
    catch (e)
    {
        console.log(e);
    }
});

到目前为止一切都很好。但现在是那个让我发疯的角色。在另一个jquery脚本中,我尝试为新的datatable再次调用datatables方法。代码如下所示:

$('.DeleteEntity').click(
function () {
    try 
    {
        var deleteTable = $('#DeleteTable').DataTable({
            processing: true,
            serverside: true,
            destroy: true,
            ajax: {
                url: "/Administration/ShowEntriesDelete"
            } 
        });
    }
    catch (e)
    {
        console.log(e);
    }
});
这个Ajax调用不再起作用了。如下图所示,C代码中的操作方法失败

在本例中,请求URL如下所示

所以我的问题是:尽管我在jquery代码中使用了相同的函数,但为什么我会得到这种行为?还是有什么我完全错了

我想我已经尝试了所有的方法,但是我还是不明白。这两个数据表在HTML中看起来完全相同,只是id和列标题不同

我也找了类似的问题,但什么也找不到。如果有人能给我一个提示,我将非常高兴

致以最良好的祝愿

编辑: @卡尔文·阿南达

我修改了您的答案,并将两个DataTable函数添加到一个脚本中,仅用于测试目的。这是洞的脚本

var troubleshootingIDs = [];
$(document).ready(
    function () {

    // if I call this method, everything works just fine, the c# code throws an error (which it should) but the ajax method is successfull
    var problemTable = $('#ProblemTable').DataTable({
        processing: true,  // show message while querying fro data
        serverSide: true,
        "ajax":  "/Administration/ShowEntriesDelete"
    }); 

    // if I call this method, the ajax method doesnt get called, because there is absolute no data provided in the url 
    var deleteTable = $('#DeleteTable').DataTable({
        processing: true,
        serverside: true,
        destroy: true,
        "ajax": "/Administration/ShowEntriesDelete",
        "columns": [
            { "data": "Description" },
            { "data": "Connection" },
            { "data": "Action" }
        ]

    });


    var table = $('#reasonTable').DataTable({
        pageLength: 2,
        lengthChange: false,
        columnDefs: [
            {
                targets: [3],
                className: "hide_me"
            }
        ]
    }
    );

    var agentButton = $('.agentButton');


    $('td').on('click', '#BadgeContainer', function () {
        var IDs = [];
        $('#DocList').empty();
        $('.DocLinkID').each(function (counter) {
            IDs[counter] = $(this).html();
        });
        console.log(IDs);

        $.ajax({
            url: "/OverView/GetDocuments",
            traditional: true,
            data: { IDs: IDs },
            content: 'application/json; charset=utf-8',
            success: listDocuments
        });
    });



    $('#reasonTable tbody').on('click', 'tr', function () {

        $('#SolutionList').empty();
        troubleshootingIDs = [];

        if ($(this).hasClass('selected')) {

        }
        else {
            table.$('tr.selected').removeClass('selected');
            $(this).addClass('selected');
        }

        var selectedReason = $('.ReasonGuid', this).text();


        $.ajax({
            url: '/OverView/ReasonJson',
            contentType: 'application/json; charset=utf-8',
            data: { 'selectedReason': selectedReason },
            success: handleJsonForWizard
        }
        );

    }
    );

    $('.SolutionButton').on('click',
        function () {

            var indexToRemove = [];
            var dummyArray = [];

            for (var counter = 0; counter < troubleshootingIDs.length; counter++) {
                if ($('#q' + (+counter * 2)).hasClass('btn-active')) {
                    indexToRemove.push(counter);
                }

                dummyArray[counter] = troubleshootingIDs[counter];
            }


            for (var counter = indexToRemove.length - 1; counter >= 0; counter--) {
                dummyArray.splice(indexToRemove[counter], 1);
            }

            $.ajax(
                {
                    url: '/OverView/GetSolutions',
                    contentType: 'application/json; charset=utf-8',
                    traditional: true,
                    data: { troubleshootingIDs: dummyArray },
                    success: function (json) {
                        $('#SolutionList').empty();

                        try {
                            for (var counter = 0; counter < Object.keys(json).length; counter++) {
                                $('#SolutionList').append('<li class="list-group-item">' + json[counter] + '</li>');
                            }
                        }

                        catch (err) {

                        }
                    }
                }
            );
        }
    );

    $('#ProblemTable tbody').on('click', '.WizardButton',
        function () {
            var IdToGet = $(this).attr('id');

            var url = '/OverView/Wizard?SelectedID=';

            window.location.replace(url + IdToGet);

        }

    );

    // Carousel fuction overriding (doesn't work wiht jquery template)

    $('.carousel-control.left').click(
        function () {

            var parentId = '#' + $(this).parent().attr('id');

            $(parentId).carousel('prev');
        }
    );

    $('.carousel-control.right').click(
        function () {

            var parentId = '#' + $(this).parent().attr('id');

            $(parentId).carousel('next');
        }
    );


    // comment to define

    $('.row #BackToTable').click(
        function () {
            window.location.replace("/OverView");
        }

    );



    $('body').on('click', '.AgentButton',
        function () {


            var idNum = $(this).attr('id');

            var num = idNum.substring(1);

            $('#' + idNum).toggleClass('btn-active');

            if ((num % 2) == 0) {

                var numToCompare = +num + 1;
                var classToCompare = $('#q' + numToCompare).attr('class');

                if (classToCompare == 'btn AgentButton btn-active') {
                    $('#q' + numToCompare).toggleClass('btn-active');
                }
            }


            else {

                var numToCompare = +num - 1;
                var classToCompare = $('#q' + numToCompare).attr('class');

                if (classToCompare == 'btn AgentButton btn-active') {
                    $('#q' + numToCompare).toggleClass('btn-active');
                }
            }

        }
    );


    function handleJsonForWizard(json) {

        initializeCarousel(json.ImgLinks);
        initializeAgent(json.Troubleshootings, json.TroubleshootingIDs);
    }


    function initializeCarousel(imgLinks) {

        $('#ReasonVisualisation > ol').empty();
        $('#ReasonVisualisation > .carousel-inner').empty();
        for (var counter = 0; counter < Object.keys(imgLinks).length; counter++) {
            $('#ReasonVisualisation > ol').append('<li data-target="#ReasonVisualisation" data-slide-to="' + counter + '"></li>');
            $('#ReasonVisualisation > .carousel-inner').append('<div class="item"><img src="' + imgLinks[counter] + '"/> </div>');
        }

        $('#ReasonVisualisation > ol >li:first').addClass('active');
        $('#ReasonVisualisation > .carousel-inner>div:first').addClass('active');

        var list = $('#ReasonVisualisation > ol').html();

        var inner = $('#ReasonVisualisation > .carousel-inner').html();


    }

    function initializeAgent(troubleshootings, ids) {
        $('#Agent').empty();
        for (var counter = 0; counter < Object.keys(troubleshootings).length; counter++) {
            $('#Agent').append('<div>' + troubleshootings[counter] + ' </div>');
            $('#Agent').append('<div class="btn AgentButton" id="q' + (counter * 2) + '">Yes</div>');
            $('#Agent').append('<div class="btn AgentButton" id="q' + ((counter * 2) + 1) + '">No</div>');
            agentButton = $('.AgentButton');
            troubleshootingIDs[counter] = ids[counter];
        }
    }


    function listDocuments(json) {
        //Array.isArray(json);
        if (json.length > 1) {
            for (var counter = 0; counter < json.length; counter++) {
                $('#DocList').append('<li> <a href=\"' + json[counter] + '\" > Link </a></li>');
            }
        }
    }
}
var故障诊断ID=[];
$(文件)。准备好了吗(
函数(){
//如果我调用这个方法,一切正常,c代码会抛出一个错误(应该是这样),但是ajax方法成功了
var problemTable=$(“#problemTable”).DataTable({
处理:true,//查询fro数据时显示消息
服务器端:是的,
“ajax”:“/Administration/ShowEntriesDelete”
}); 
//如果调用此方法,则不会调用ajax方法,因为url中绝对没有提供任何数据
var deleteTable=$('#deleteTable')。数据表({
处理:对,
服务器端:是的,
摧毁:没错,
“ajax”:“/Administration/ShowEntriesDelete”,
“栏目”:[
{“数据”:“描述”},
{“数据”:“连接”},
{“数据”:“操作”}
]
});
变量表=$(“#推理表”).DataTable({
页长:2,
长度变化:错误,
columnDefs:[
{
目标:[3],
类名:“隐藏我”
}
]
}
);
var agentButton=$('.agentButton');
$('td')。在('click','#BadgeContainer',函数()上{
var-id=[];
$('#DocList').empty();
$('.DocLinkID')。每个(函数(计数器){
IDs[counter]=$(this.html();
});
控制台日志(IDs);
$.ajax({
url:“/OverView/GetDocuments”,
传统的:是的,
数据:{IDs:IDs},
内容:“application/json;charset=utf-8”,
成功:listDocuments
});
});
$(#reasonable tbody')。在('click','tr',函数(){
$(“#解决方案列表”).empty();
疑难解答IDS=[];
if($(this).hasClass('selected')){
}
否则{
表.$('tr.selected')。removeClass('selected');
$(this.addClass('selected');
}
var selectedReason=$('.ReasonGuid',this.text();
$.ajax({
url:“/OverView/ReasonJson”,
contentType:'application/json;charset=utf-8',
数据:{'selectedReason':selectedReason},
成功:handleJsonForWizard
}
);
}
);
$('.SolutionButton')。在('单击'),
函数(){
var indexToRemove=[];
var dummyArray=[];
用于(变量计数器=0;计数器<疑难解答ID.length;计数器++){
if($('#q'+(+计数器*2)).hasClass('btn-active')){
指数移动。推(计数器);
}
dummyArray[计数器]=疑难解答ID[计数器];
}
对于(var counter=indexToRemove.length-1;计数器>=0;计数器--){
dummyArray.splice(indexToRemove[计数器],1);
}
$.ajax(
{
url:“/OverView/GetSolutions”,
contentType:'application/json;charset=utf-8',
传统的:是的,
数据:{troubleshootingIDs:dummyArray},
成功:函数(json){
$(“#解决方案列表”).empty();
试一试{
for(var counter=0;counter”+json[counter]+””);
}
}
捕捉(错误){
}
}
}
);
}
);
$(#ProblemTable tbody')。在('click','WizardButton',上,
函数(){
var IdToGet=$(this.attr('id');
var url='/OverView/Wizard?SelectedID=';
window.location.replace(url+IdToGet);
}
);
//转盘功能重写(不适用于jquery模板)
$('.carousel control.left')。单击(
函数(){
var parentId='#'+$(this.parent().attr('id');
$(parentId).carousel('prev');
}
);
$('.carousel control.right')。单击(
函数(){
var parentId='#'+$(this.parent().attr('id');
$(parentId).carousel('next');
}
);
//要定义的注释
$('
$(".DeleteEntity").click(
function () {
    try 
    {
        var deleteTable = $("#DeleteTable").DataTable({
            processing: true,
            serverside: true,
            destroy: true,
            "ajax": "/Administration/ShowEntriesDelete"
        });
    }
    catch (e)
    {
        console.log(e);
    }
});