上次用客户端进行数据刷新的方式,和官方的Demo实现存在差异性,今天花了一点时间好好研究了一下后台时时刷新的方式.将写的代码重新update了一次,在这之前找过好多的资料,发现都没有找到好的例子,自己查了一下官方的DEMO然后本地实现了一次,结合Jqgrid的前端库,发现还是非常便捷的.不多说了,直接上代码了.

前端代码:

 <!DOCTYPE html>

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

     <link href="Style/jquery-ui.css" rel="stylesheet" />

     <link href="Style/ui.jqgrid.css" rel="stylesheet" />

     <link href="Style/ui.jqgrid-bootstarp.css" rel="stylesheet" />

     <!--Reference the jQuery library. this library should be first one  -->

     <script src="Scripts/jquery-1.10.2.min.js"></script>

     <!--Reference the SignalR library. -->

     <script src="Scripts/jquery.signalR-2.0.2.js"></script>

     <!--Reference the jqgrid core library. -->

     <script src="Scripts/jquery.jqGrid.min.js"></script>

     <!--Reference the jqgrid language library. -->

     <script src="Scripts/grid.locale-en.js"></script>

     <!--Reference the autogenerated SignalR hub script. -->

     <script src='signalr/hubs'></script>

     <script type="text/javascript">

         var mydata = { State: "none", Price: 1.99, Brand: "none" };

         var ticket;

         $(function () {

             InitJqGrid();

             ticket = $.connection.pricehub;

             InitTicket(ticket);

             $.connection.hub.start().done(function () {

                 $("#btnstart").click(function () {

                     ticket.server.startTickets();

                 });

                 $("#btnstop").click(function () {

                     ticket.server.stopTickets();

                 });

             });

         })

         //

         function InitJqGrid() {

             $("#tbprice").jqGrid({

                 datatype: "local",

                 data: mydata,

                 height: 600,

                 width: 500,

                 multiselect: false,

                 autowidth: true,

                 rownumbers: true,

                 rowNum: 50, //if you don't set this ,the page size will just show about 20 row counts.

                 colNames: ['State', 'Price', 'Brand'],

                 colModel: [

                     { label: 'State', name: 'State', width: 60 },

                     { label: 'Price', name: 'Price', width: 80 },

                     { label: 'Brand', name: 'Brand', width: 80 }

                 ],

                 viewrecords: true, // show the current page, data rang and total records on the toolbar

                 caption: "Current Price Tag",

                 pager: "#jqGridPager"

             });

         }

         function refreshGrid($grid, results) {

             $grid.jqGrid('clearGridData')

                  .jqGrid('setGridParam', { data: results })

                  .trigger('reloadGrid');

         }

         function InitTicket(ticket) {

             //init the client function

             ticket.client.updateprice = function (tickets) {

                 refreshGrid($("#tbprice"), tickets);

             }

         }

     </script>

     <title>Price Price </title>

 </head>

 <body>

     <div>

         <input type="button" id="btnstart" value="Start" />

         <input type="button" id="btnstop" value="Stop" />

     </div>

     <div>

         <table id="tbprice"></table>

         <div id="jqGridPager"></div>

     </div>

 </body>

 </html>

后端代码:

 using Microsoft.AspNet.SignalR;

 using Microsoft.AspNet.SignalR.Hubs;

 using SignalRChat.Hubs.Data;

 using System;

 using System.Collections.Generic;

 using System.Linq;

 using System.Web;

 using System.Threading;

 namespace SignalRChat.Hubs

 {

     [HubName("pricehub")]

     public class PriceHub : Hub

     {

         private readonly TicketPrice _ticketprice = new TicketPrice();

         private readonly object _ticketrefreshlock = new object();

         private readonly object _ticketupdatelock = new object();

         //the time val should be static or in the static class

         private static Timer _timer;

         //the Interval of call function

         private readonly TimeSpan _updateInterval = TimeSpan.FromMilliseconds();

         private static string state = "close";

         [HubMethodName("startTickets")]

         public void StartTickets()

         {

             lock (_ticketrefreshlock)

             {

                 //the judge if it is necessary to init another thread to fresh the value

                 if (state == "close")

                 {

                     _timer = new Timer(RefreshTicket, null, _updateInterval, _updateInterval);

                     state = "open";

                 }

             }

         }

         [HubMethodName("stopTickets")]

         public void StopTickets()

         {

             lock (_ticketrefreshlock)

             {

                 if (state == "open")

                 {

                     if (_timer != null)

                     {

                         _timer.Dispose();

                         state = "close";

                     }

                 }

             }

         }

         private void RefreshTicket(object state)

         {

             lock (_ticketupdatelock)

             {

                 //return the tickets to client

                 BroadcastPriceTicketBoard(_ticketprice.GetAllTickets());

             }

         }

         //this is the reference for client broswer to update the price ,and pass the value to client .

         private void BroadcastPriceTicketBoard(List<TicketPrice> tickets)

         {

             //call the client javascript function to refresh data to jqgrid table(the caller proproty mean the data only to pass to caller ,not all clients)

             Clients.Caller.updateprice(tickets);

         }

     }

 }

效果图:

参考:

===>JqGridDemo<===

===>SignalR-StockTicker-Demo<===

项目文件:

===>官方StockTicker.zip<===

===>图中演示项目<===

不用找了,比较全的signalR例子已经为你准备好了(2)---JqGrid 服务端刷新方式-注释详细-DEMO源码下载的更多相关文章

  1. 不用找了,比较全的signalR例子已经为你准备好了.

    这几天想着将一个winform的工具上线到web上,因为对时时性的要求比较高,找朋友咨询了一下推荐了SignlarR 框架,比较强大.昨天才看到,今天研究了一下将里面的例子都拿出来共享. 最全的参考: ...

  2. 3、netty第二个例子，使用netty建立客户端，与服务端通讯

    第一个例子中,建立了http的服务器端,可以直接使用curl命令,或者浏览器直接访问. 在第二个例子中,建立一个netty的客户端来主动发送请求,模拟浏览器发送请求. 这里先启动服务端,再启动客户端, ...

  3. FLEX外包团队：Flex例子DEMO源码

    代码如下: <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx=& ...

  4. webRTC源码下载 Windows Mac(iOS) Linux(Android)全

    webRTC源码下载地址:https://pan.baidu.com/s/18CjClvAuz3B9oF33ngbJIw  提取码:wl1e  Windows版:visual studio 2017工 ...

  5. signalR例子

    不用找了,比较全的signalR例子已经为你准备好了.   这几天想着将一个winform的工具上线到web上,因为对时时性的要求比较高,找朋友咨询了一下推荐了SignlarR 框架,比较强大.昨天才 ...

  6. Apache DolphinScheduler 2.X保姆级源码解析，中国移动工程师揭秘服务调度启动全流程

    2022年1月,科学技术部高新技术司副司长梅建平在"第六届中国新金融高峰论坛"上表示,当前数据量已经大大超过了处理能力的上限,若信息技术仍然是渐进式发展,则数据处理能力的提升将远远 ...

  7. 一个简单的SignalR例子

    本文介绍如何使用SignalR的Hub制作一个简单的点赞页面.不同浏览器(或者不同窗口)打开同一个页面,在任何一个页面点赞,所有页面同时更新点赞数. 1.使用Visual Studio Communi ...

  8. Android图片加载框架最全解析（二），从源码的角度理解Glide的执行流程

    在本系列的上一篇文章中,我们学习了Glide的基本用法,体验了这个图片加载框架的强大功能,以及它非常简便的API.还没有看过上一篇文章的朋友,建议先去阅读 Android图片加载框架最全解析(一),G ...

  9. C#外挂QQ找茬辅助源码，早期开发

    这是一款几年前开发的工具,当年作为一民IT纯屌,为了当年自己心目中的一位女神熬夜开发完成.女神使用后找茬等级瞬间从眼明手快升级为三只眼...每次看到这个就会想起那段屌丝与女神的回忆.今天特地把代码更新 ...

随机推荐

  1. ASP.NET Web API 自定义MediaType实现jsonp跨域调用

    代码来自<ASP.NET Web API 2 框架揭秘>一书. 直接上代码: /// <summary> /// 自定义jsonp MediaType /// </sum ...

  2. sublime3插件安装方法

    sublime3插件安装方法:http://blog.csdn.net/u011627980/article/details/52171886

  3. java.lang.IllegalStateException: Circular dependencies cannot exist in RelativeLayout

    <TextView android:layout_width="fill_parent" android:layout_height="wrap_content&q ...

  4. 【字符串】跳来跳去的KMP匹配

    原理: 不给予证明啦(懒得一批 但是代码中有给还算详细的注释 参考:https://www.cnblogs.com/yjiyjige/p/3263858.html 模板题: 洛谷P3375: http ...

  5. sql server 中数据库数据导入到另一个库中

    这篇说了sql语句对于备份的数据库进行还原 ,如果数据量大了还是什么问题,发现我的数据丢失了一些,头疼 sql server 备份还原 下面使用的的数据导入来解决这个问题,因为数据量比较大,导出来的脚 ...

  6. android 界面控件 textview 全解

    textview基本使用: <TextView 10. android:id="@+id/txtOne" 11. android:layout_width="200 ...

  7. 一个nginx反向代理， 负载均衡的例子

    #/etc/nginx/conf.d/master.conf #区分大小写 #设定负载均衡的服务器列表 upstream master.balancing { #weigth参数表示权值,权值越高被分 ...

  8. session和cookie的介绍

    1.将cookie,session之前,还是先说说http协议 http协议是基于TCP/UDP之上的应用层一个标准 请求,响应的模式.是你必须先请求到一个服务端之后,服务端才会响应到你.他是不会无缘 ...

  9. (搬运以学习)flask 上下文的实现

    引言 本文主要梳理了flask的current_app, request, session, g的实现原理 源码说明 本文使用flask 0.5 版本 application context 和req ...

  10. centos7编译安装Apache

    一.安装 安装之前先将服务器的防火墙关掉. systemctl  stop  firewalld systemctl  disable  firewall 第一步: 安装apr 下载: wget -c ...