【问题标题】:Display loading screen while loading page with some heavy back end work?在加载页面时显示加载屏幕并进行一些繁重的后端工作?
【发布时间】:2017-03-22 10:06:05
【问题描述】:

我正在尝试在加载带有一些图形和图表的仪表板页面时显示加载页面(为此我使用 Telerik RadHtmlChart 控件)。这些图形和图表的数据是从远程 API 获取的,对数据库的查询非常繁重,因此 API 调用可能需要 5-6 秒才能收到它们。所有这些都是在页面后面的代码中完成的。所以,我想在页面加载时实现某种形式的加载屏幕。我已经尝试了一些jQuery实现,但是页面不会发送给用户在Page_Load事件完成之前,即所有数据都已获取,这反过来意味着不会有加载图像,在页面显示之前,只需等待用户 5-6 分钟。

有什么好办法解决这个问题吗?有没有办法渲染页面,然后在代码中调用一个函数,然后让它运行并渲染图表和图形?

【问题讨论】:

  • 对于仪表板,您可以加载面板/基本 UI,并在获取数据/图表时在每个面板内显示加载图像。

标签: javascript jquery asp.net webforms loading


【解决方案1】:

您应该使用 AJAX(开发人员的梦想,正如 w3schools 所说的 xD)。

首先您应该发送页面内容,不进行任何查询,因此页面会立即发送。然后,页面应该向您的服务器进行 AJAX 查询(到一个特殊的 url 或其他),询问它想要的信息。同时你可以显示一个加载图标。当 AJAX 调用返回数据时,您可以使用它初始化图表小部件。

根据您的前端开发方式,这将是(不是)微不足道的事情,顺便说一句。

您可以从这里开始:https://www.w3schools.com/xml/ajax_intro.asp

澄清一下:

  • 您必须更改为页面提供服务的方法以不执行任何查询。
  • 然后创建一个页面来进行长查询并在没有任何 HTML 标记的情况下输出它。例如,仅用于处理小部件的格式化数据。
  • 您应该将所有初始化小部件的脚本移到一个函数的前面。
  • 最后,您应该在启动时添加一个 AJAX 查询,该查询将调用新创建的页面、处理数据(jQuery 具有直接加载 JSON 的 AJAX 方法)并使用这些数据初始化您的小部件。

【讨论】:

    猜你喜欢
    • 2016-02-01
    • 2014-10-04
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-05-31
    • 1970-01-01
    相关资源
    最近更新 更多