1

私はウェブデザイン（ASP.net MVC4 / Razorを使用）が初めてで、インターネット上の情報が多すぎる場合があります。2時間グーグルで調べたところ、問題に対してさまざまな回答が見つかりましたが、どれが最適かわかりませんでしたということで、ここで質問します。

データベース (最初に EF コード) を取得しましたが、さまざまな場所から挿入されるログ テーブルがあります。ただし、ページを作成したいのですが、そのページには常に最後の 20 行を表示する必要があります。

だから私はグーグルで見つけました：

  • マイクロソフトのアヤックス？

  • Jquery Ajax?

  • 目立たないAjax？

  • Jqueryを使用したSignalR?

  • ウェブソケット?

  • テンプレートで ajax を使用しますか?

確かに、他のオプションよりも優れているオプションや、まだ言及していないオプションがいくつかあると思います。誰かが私が欲しいものを手に入れるためにどの方向を掘り下げる必要があるか教えてください. （すべてのコードを取得したくはありません。オプションが多すぎて少し迷っているので、ガイダンスが必要です+-）

編集：

さらにいくつか指定します。JSON を取得するための API を作成する必要があることはわかっています。

public JsonResult GetLast20LogRows()
{
  ...
  return listoflast20rows; //(as List<DatabaseLog>()) 
}

HTML/Javascript/ajaxパーと、ページ全体を更新せずに HTML を更新する方法がわからないだけです。(Ajax)

EDIT2：

サーバー側のコード:

ChatBotLog.cs(EFコードファースト):

  public class ChatBotLog
    {
        [Key]
        public int Id { get; set; }
        public DateTime? Date { get; set; }
        public ServerRegion Region { get; set; }
        public string Text { get; set; }
    }

そして今、最後の 20 行を表示するメソッドを .cshtml (カミソリ ページ) で取得したいので、メソッドを高速にして最後の 20 行を取得します。

public JsonResult GetLastLogRows()
{
     using (var db = new MyDb())
     {
         var listlog = db.ChatBotLogs.OrderByDescending(x => x.Date).Take(20);
         return Json(listlog);
     }
}

それは私が読んだことに従って作成する必要がある方法だと思います。とにかく、私が間違っているかどうか教えてください。ビューにそれを表示する方法をまだ探しています。どのタイプの ajax を使用する必要がありますか? 「リアルタイムライブ」である必要がありますが、5秒ごとにデータを更新するようにします。

私が立ち往生している場所を今よりよく理解していただければ幸いです。

4

1 に答える 1

1

あなたの問題はとても簡単なアプローチで解決できると思います：

1- Web サーバーからデータを取得する jQuery 関数を作成します。例: 

function GetLatestLogEntries()
{
    var latestLogEntries;

    $.ajax({
                 type: "GET",
                 url: "/{RootFolder}/GetLast20LogRows",                   
                 dataType: "json",
                 success: function (e) {
                     latestLogENtries = e.data;  

                     // here you will need to format the log entries according to your needs, for example
                     $("#divLogContainer").html(latestLogENtries);

                 }
          });
    }

2- 次のコードをスクリプト タグ内に配置して、すべてのページ要素が読み込まれた後に実行されるようにします。

$(function(){
       setInterval(GetLatestLogEntries(),5000);
})

3-スマイル:)

これにより、GetLatestLogEntries関数が 5 秒ごとに実行され、ページは最新の 20 エントリで更新されます。

さらに説明が必要な場合は、この回答にコメントしてください

お役に立てれば ：）

于 2013-02-03T13:43:50.723 に答える