2

I followed this simple tutorial and managed to create a test web application with signalR. But when I tried to recreate it using ASP.NET website and then browse for the html page, I got the following error:

TypeError: $.connection is undefined
var chat = $.connection.chatHub;

This is the structure of my project if this matters:

enter image description here

Based on what I found, setting runAllManagedModulesForAllRequests to true in web.config is necessary, so I already did it. Also the tutorial I followed is a little bit outdated since I use VS 2010(i.e. .NET Framework 4) which is only compatible with SignalR v 1.1.3.

How come I can't get this working in a website but works perfectly in a web application?

Update:

One solution(which I believe to be right) suggests to

Put my code behind file in a seperate .cs file and put that cs file in App_Code folder

So I tried to change my html file into a .aspx file. This way I have a code behind file (i.e. .aspx.cs) But I'm confused on what it is meant to move the code behind file because nesting my .aspx file to a .aspx.cs file residing in App_Code folder is not allowed.

What does that quoted answer above means?

Update:

Here are my script references in HTMLPage.htm together with the main function.

<!--Reference the jQuery library. -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<!--Reference the SignalR library. -->
<script src="/Scripts/jquery.signalR-1.1.3.js"></script>
<!--Reference the autogenerated SignalR hub script. -->
<script src="/signalr/hubs"></script>
<!--Add script to update the page and send messages.--> 
<script type="text/javascript">
    $(function () {
        // Declare a proxy to reference the hub. 
        var chat = $.connection.chatHub;
        // Create a function that the hub can call to broadcast messages.
        chat.client.broadcastMessage = function (name, message) {
            // Html encode display name and message. 
            var encodedName = $('<div />').text(name).html();
            var encodedMsg = $('<div />').text(message).html();
            // Add the message to the page. 
            $('#discussion').append('<li><strong>' + encodedName
                + '</strong>:&nbsp;&nbsp;' + encodedMsg + '</li>');
        };
        // Get the user name and store it to prepend to messages.
        $('#displayname').val(prompt('Enter your name:', ''));
        // Set initial focus to message input box.  
        $('#message').focus();
        // Start the connection.
        $.connection.hub.start().done(function () {
            $('#sendmessage').click(function () {
                // Call the Send method on the hub. 
                chat.server.send($('#displayname').val(), $('#message').val());
                // Clear text box and reset focus for next comment. 
                $('#message').val('').focus();
            });
        });
    });
</script>
6
  • @LarsHöppner What do you mean by adding the html page?
    – Arman
    Dec 9, 2013 at 5:44
  • @LarsHöppner I think this problem is already solved here - the second answer by ozgkrc. But it seems that I have only little idea on what exactly he says. Can you please shed light on this?
    – Arman
    Dec 9, 2013 at 6:14
  • I don't think that answer applies here - in your case, $.connection isn't defined, which means the SignalR script isn't initializing at all. That's why I asked for the HTML of the page you're visiting - to see whether the respective js files are included. Dec 9, 2013 at 7:30
  • @LarsHöppner I have included the code that might help.
    – Arman
    Dec 9, 2013 at 7:58
  • Make sure there are no other jQuery references - also see my answer here Dec 9, 2013 at 10:46

1 Answer 1

3

You should always check the console when something doesn't work - in your case, the page simply can't find the references to the SignalR script and to /signalr/hubs (and it says so in the console). If you change the urls to "/WebSite18/Scripts/jquery.signalR-1.1.3.js" and "/Website18/signalr/hubs", it will work.

7
  • Holy cow it worked but I don't get it why. This is the first time that someone suggested me to include the project/website name in the directory of referencing js files. Having just doing drag-and-drop to automate the work of referencing them and let VS to do it for me, and this is just the case of putting me in trouble. I also looked and followed the tutorials, met some with similar problems and this is the only problem? This is madness for me. But how do this work exactly Lars?
    – Arman
    Dec 12, 2013 at 21:33
  • 1
    It's because of the document root of your web server / the virtual path of the website project. Instead of changing the src paths, you can also right-click your website project in the solution explorer, click "Properties Window" and change the virtual path to "/". Dec 12, 2013 at 21:40
  • Oh that's it - because of my virtual path! But why did referencing JQuery like src="Scripts/jquery-1.6.4.js" or the old normal way still works and the other two does not?
    – Arman
    Dec 12, 2013 at 21:43
  • You're using google's CDN in your example, this is not relative to your server. Dec 12, 2013 at 21:45
  • 2
    It simply means there's a file at that location in your file system, so you can check in explorer. Also: try right-clicking and opening the script in a new tab, this will show the full path it is using. If you omit the leading /, it will load relative to the current location, so if you're already in /WebSite18/, it will work. With the / at the start, it will look at the document root. Dec 12, 2013 at 21:52

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.