Get real time data using WebMethod and SignalR in ASP.Net

Hi rakeshkuma,

Follow the below steps.

• Create an ASP.Net WebForm application.
• Add the Microsoft.AspNet.SignalR packages from NuGet Package Manager.
• Add Startup.cs
• Add MyHub.cs
• Add WebService
• Call the WebService

You can use Timer in your application to periodically check your database for new notifications and add those to the data used by the hub.

Check this example. Now please take its reference and correct your code.

Database

For this example I have used of Northwind database that you can download using the link given below.

Download Northwind Database

Install Microsoft.AspNet.SignalR packages from NuGet.

Install-Package Microsoft.AspNet.SignalR -Version 2.2.2 

Add Startup.cs and write the following code.

using Microsoft.Owin;
using Owin;

[assembly: OwinStartup(typeof(SignalR_Example.Startup))]
namespace SignalR_Example
{
    public class Startup
    {
        public void Configuration(IAppBuilder app)
        {
            app.MapSignalR();
        }
    }
}

Add MyHub.cs.

public class MyHub : Hub
{
}

Namespaces

C#

using System.Collections.Generic;
using System.Configuration;
using System.Data.SqlClient;
using System.Web.Services;

VB.Net

Imports System.Collections.Generic
Imports System.Configuration
Imports System.Data.SqlClient
Imports System.Web.Services

WebService

C#

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line. 
[System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService
{
    [WebMethod]
    public List<Customer> GetCustomers()
    {
        string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
        using (SqlConnection con = new SqlConnection(constr))
        {
            using (SqlCommand cmd = new SqlCommand("SELECT TOP 5 CustomerID,ContactName,City FROM Customers"))
            {
                cmd.Connection = con;
                List<Customer> Customers = new List<Customer>();
                con.Open();
                using (SqlDataReader sdr = cmd.ExecuteReader())
                {
                    while (sdr.Read())
                    {
                        Customers.Add(new Customer()
                        {
                            CustomerID = sdr["CustomerID"].ToString(),
                            Name = sdr["ContactName"].ToString(),
                            City = sdr["City"].ToString()
                        });
                    }
                }
                con.Close();

                return Customers;
            }
        }
    }

    public class Customer
    {
        public string CustomerID { get; set; }
        public string Name { get; set; }
        public string City { get; set; }
    }
}

VB.Net

<WebService([Namespace]:="http://tempuri.org/")>
<WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)>
<System.ComponentModel.ToolboxItem(False)>
<System.Web.Script.Services.ScriptService>
Public Class WebService
    Inherits System.Web.Services.WebService
    <WebMethod>
    Public Function GetCustomers() As List(Of Customer)
        Dim constr As String = ConfigurationManager.ConnectionStrings("constr").ConnectionString
        Using con As SqlConnection = New SqlConnection(constr)
            Using cmd As SqlCommand = New SqlCommand("SELECT TOP 5 CustomerID,ContactName,City FROM Customers")
                cmd.Connection = con
                Dim Customers As List(Of Customer) = New List(Of Customer)()
                con.Open()
                Using sdr As SqlDataReader = cmd.ExecuteReader()
                    While sdr.Read()
                        Customers.Add(New Customer() With {
                            .CustomerID = sdr("CustomerID").ToString(),
                            .Name = sdr("ContactName").ToString(),
                            .City = sdr("City").ToString()
                        })
                    End While
                End Using
                con.Close()
                Return Customers
            End Using
        End Using
    End Function

    Public Class Customer
        Public Property CustomerID As String
        Public Property Name As String
        Public Property City As String
    End Class
End Class

HTML

<table class="tblCustomers" style="border-collapse: collapse;" cellspacing="0" border="1">
    <thead>
        <tr>
            <th width="150">Id</th>
            <th width="150">Name</th>
            <th width="150">City</th>
        </tr>
    </thead>
    <tbody>
    </tbody>
</table>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="Scripts/jquery.signalR-2.2.2.min.js"></script>
<script type="text/javascript" src="signalr/hubs"></script>
<script type="text/javascript">
    $(function () {
        $.connection.hub.start().done(function () {
            setInterval(GetData, 1000);
        }).fail(function (e) {
            alert(e);
        });
    });

    function GetData() {
        $.ajax({
            type: "POST",
            url: "WebService.asmx/GetCustomers",
            data: '{}',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            async: true,
            success: function (response) {
                var rows = '';
                $(response.d).each(function () {
                    rows += "<tr><td>" + this.CustomerID + "</td><td>" + this.Name + "</td><td>" + this.City + "</td></tr>";
                });
                $('.tblCustomers tbody').empty();
                $('.tblCustomers tbody').append(rows);
            },
            failure: function (response) {
                alert(response);
            },
            error: function (response) {
                alert(response);
            }
        });
    }
</script>

Screenshot