2017-03-22 11 views
0

ダッシュボードページを読み込んでいる間に読み込み中のページを表示しようとしています(このためにTelerik RadHtmlChartコントロールを使用しています)。これらのグラフとグラフのデータはリモートAPIからフェッチされ、dbへのクエリはかなり重いので、APIコールは5〜6秒以上かかることがあります。これはページ上のコードの中で行われます。だから、私は、ページが読み込まれている間、画面の読み込みのいくつかのフォームを実装したいと思います。私はいくつかのjQueryの実装を試しましたが、ページはユーザーに送信されませんPage_Loadイベントが行われる前に、つまりすべてのデータがフェッチされたときに、読み込み中のイメージがないことを意味します。 5-6ページが表示される前にユーザーを待ちます。重いバックエンドの作業でページをロード中に画面を表示しますか?

いい方法がありますか?ページをレンダリングする方法はありますか?それでは、コード内の関数を呼び出して、それを実行してグラフやグラフをレンダリングさせますか?

+0

ダッシュボードでは、パネル/ベースのUIを読み込み、データ/グラフがフェッチされているときに各パネル内に画像を読み込むことができます。 – sabithpocker

答えて

1

あなたはAJAXを使用するべきです(w3schoolsがxDと言うので、開発者の夢です)。

最初に、ページをすぐに送信できるように、クエリを実行せずにページの内容を送信する必要があります。次に、ページはAJAXクエリをサーバーに送信します(特別なURL、または何でも)、必要な情報を要求します。一方、読み込みアイコンを表示することができます。 AJAX呼び出しがデータを返すと、チャートウィジェットを初期化することができます。

どのようにフロントエンドを開発したかによって、これは簡単ではありません(btw)。

あなたはここに起動することができます。https://www.w3schools.com/xml/ajax_intro.asp

を明確にする:

  • あなたが任意のクエリをしないためのページを提供していますあなたの方法を変更する必要があります。
  • 次に、長いクエリを作成し、HTMLマークアップなしで出力するページを作成します。例えば、あなたのウィジェットで動作するフォーマットされたデータ。
  • フロントでは、ウィジェットを初期化するすべてのスクリプトを関数に移動する必要があります。
  • 最後に、新しく作成したページを呼び出し、データを処理する(jQueryにはJSONを直接ロードするAJAXメソッドがあります)、このデータでウィジェットを初期化するAJAXクエリを追加する必要があります。