Rossco
Rossco

Reputation: 3763

SignalR cannot invoke client listening function

So I am trying to implement SignalR in a project my code is as follows:

MtHub.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Microsoft.AspNet.SignalR;
using Microsoft.AspNet.SignalR.Hubs;

namespace HaldanMT
{
    public class MtHub : Hub
    {
        public void RemoveResource(string message)
        {
            Clients.All.RemoveResource(message);
        }
    }
}

custom.js:

$(document).ready(function () {
    $.connection.mtHub.client.removeResource = function (message) { // This is the client listener that will fire once the server invokes the message. This is not taking place
        console.log("finished");
        RemoveResource(message); // Function to be invoked once the signalR message has been received from the server
    }
});
function RemoveSelf(message){
  $.connection.hub.start()
     .done(function () {
        console.log("Fire SignalR");
        $.connection.mtHub.server.removeResource(message); // Invoke the SingalR server function that would in turn invoke the client listening function
          })
          .fail(function () {
            console.log("Error With SignalR");
          });
    }
function RemoveResource(message){
  alert(message); // Display message
}

HTML:

<button onclick="RemoveSelf('This is a message');">Click Me</button>

<script src="~/Scripts/jquery-1.10.2.js"></script>
<script src="~/Scripts/jquery.signalR-2.2.1.js"></script>
<script src="/signalr/hubs" type="text/javascript"></script>
<script src="~/Scripts/custom.js" type="text/javascript"></script>

Now...The correct function is fired on the button click event but the response to the client does not get invoked. If I place the SignalR invoking js function within the document ready surrounded by the onclick event of the button it works just fine. But I require the SignalR invoking js function to be fired in the function RemoveSelf(message) as other things need to take place within my code.

So my question is: Does SignalR require the server side code to be invoked via a element listener, and not within a standard function. Most examples I find are using jquery event based listeners and not a traditional function.

Thank you in advance.

Upvotes: 0

Views: 2026

Answers (2)

Kelso Sharp
Kelso Sharp

Reputation: 972

Your client methods have the wrong casing for the method names, you are using "RemoveResource" and they should be "removeResource"

This is incorrect:

function RemoveResource(message){
   alert(message); // Display message
}

This should fix the problem:

function removeResource(message){
   alert(message); // Display message
}

Upvotes: 0

Mark C.
Mark C.

Reputation: 6460

The SignalR Server side code does not require invocation via element listener, but that's kind of a double-edge sword because JavaScript essentially works off events.

Your code should work exactly as it sits, but here's my code exactly and it works 100% (I don't see really many differences between our code. Could just be a typo somewhere) :

Hub

[HubName("mtHub")]
public class MtHub : Hub
{
    public void RemoveResource()
    {
        Clients.All.RemoveResource("yo");
    }
}

JavaScript (this is code inside client-side.js)

$(function() {
    $.connection.mtHub.client.removeResource = function () {
        alert("see it worked");
    }
});

var CallIt = function() {
    var connection = $.connection.mtHub;

    $.connection.hub.start().done(function () {
        alert("connected");

        connection.server.removeResource().done(function () {
            console.log("hi");
        });

    });
}

HTML

<h2 onclick="CallIt()">Fun Stuff</h2>
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
<script src="~/Scripts/jquery.signalR-2.2.1.js"></script>
<script src="~/signalr/hubs"></script>
<script src="~/Scripts/client-side.js"></script>

If this doesn't work, can you let me know what errors you get?

Upvotes: 2

Related Questions