在 Datatables jQuery 完成之前，不会显示模态

Question

我在ASP Net项目中实现DataTables JQuery（版本1.10）时遇到麻烦。问题是我正在将所有必要的配置加载到主JavaScript文件中。

i首先在GridView中绑定所有数据，然后自动执行上述JavaScript文件。

我的问题是（因为我的后端结构无法使用AJAX），我需要绑定CodeBehind（C＃）中GridView中的所有数据，并且一旦数据已经绑定，JavaScript脚本。一切都很好。但是，由于数据已绑定到DataTable的CSS和JavaScript为止，因此需要一些时间。与此同时，GridView以可怕的样式显示给用户，因此我想避免这种情况，因为它不适合用户体验。

我正在尝试（在JavaScript中）

openModal('id_modal');
load_datatable('id_table'); //function that loads all necessary for 
                            //datatables

但是，在Load_DataTable完成后，模态出现。我不知道这可能是什么原因。

值得一提的是，主JavaScript正常工作。样式已成功应用，但同样，没有显示模式。

我想弹出的模态是

<div class="modal fade" id="id_modal">
        <div class="text-center">
            <asp:Image ID="imgLoading" runat="server" 
              ImageUrl="~/img/loading.svg" AlternateText="Loading..." 
               ToolTip="Loading ..." CssClass="imageLoading" />
        </div>
    </div>

我还尝试了一个没有图像的简单模态，没有ASP控件等。但是什么也没有发生。

Answer 1

我找到了部分解决方案。

在主页上我创建

<div class="loader"></div>

放置在HTML代码的顶部。

然后在masterpage.css中定义了类：

    .loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background-color: #212529;
    background: /*HERE IT GOES THE IMAGE YOU WANT TO DISPLAY*/
    opacity: .9;
}

，最后，在我的主人中：

$(document).ready(function(){
    //DO ALL THE STUFF YOU NEED
    //AND AT THE END
    $('.loader').hide();     
});

每次加载Web表单时，它都会显示模式。