title: Signalr Close Connection
body: <p>I am trying to create a stop button in my webapp. The webapp creates bulk shortcuts to different files. I have tried using <code>$.connection.shortcutHub.stop()</code> however this comes up with an error saying <code>Cannot read property 'shortcutHub' of undefined(anonymous function)</code></p>
  
  <p>The code is below. I need the connection to be stopped once the <code>stop</code> button has been clicked. The stop button's id is <code>stopButton</code>.</p>
  
  <pre><code>        $(document).ready(function () {
          // initialize the connection to the server
          var progressNotifier = $.connection.shortcutHub;
  
          // client-side sendMessage function that will be called from the server-side
          progressNotifier.client.sendMessage = function (message, percent) {
              // update progress
              UpdateMessage(message, percent);
          };
  
          progressNotifier.client.redo = function () {
              redo();
          };
  
          progressNotifier.client.success = function () {
              success();
          };
  
          progressNotifier.client.fail = function () {
              fail();
          };
  
  
          // establish the connection to the server and start server-side operation
          $.connection.hub.start().done(function () {
              $('#confirmbutton').click(function () {
                  jQuery.noConflict();
                  document.getElementById('closeButton').setAttribute("class", "btn btn-default hidden");
                  $('#myModal').modal('show');
                  //document.getElementById('confirmbutton').disabled = true;
                  //document.getElementById('barcodepanel').setAttribute("class", "panel panel-default");
                  var ticket = getCookie('ticket');
                  var path = getCookie('CBSShortcut_Path');
                  var checkeddocs = getCheckedBoxes("dcheck");
                  var checkedfolders = getCheckedBoxes("fcheck");
                  progressNotifier.server.createshortcuts(ticket, path, checkeddocs, checkedfolders);
              });
  
              $('#stopButton').click(function () {
                  document.getElementById('closeButton').setAttribute("class", "btn btn-default");
                  document.getElementById('confirmbutton').disabled = false;
  
  
                  //What do I put here?
              });
  
  
  
          });
  
  
  
          function UpdateMessage(message, percent) {
              // get result div
              var msg = $("#result");
              // set message
              msg.html(message);
              //set value of progress bar
              document.getElementById('closeButton').setAttribute("class", "btn btn-default hidden")
              $('#progressbar').css('width', percent + '%').attr('aria-valuenow', percent);
          }
  
          function getCookie(cname) {
              var name = cname + "=";
              var ca = document.cookie.split(';');
              for (var i = 0; i &lt; ca.length; i++) {
                  var c = ca[i];
                  while (c.charAt(0) == ' ') c = c.substring(1);
                  if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
              }
              return "";
          }
  
          function redo() {
              document.getElementById('confirmbutton').disabled = false;
              jQuery.noConflict();
              $('#myModal').modal('hide');
          }
  
  
          // Pass the checkbox name to the function
          function getCheckedBoxes(chkboxclass) {
              var checkboxes = document.getElementsByClassName(chkboxclass);
              var checkboxesChecked = [];
              var ids = "";
              // loop over them all
              for (var i = 0; i &lt; checkboxes.length; i++) {
                  // And stick the checked ones onto an array...
                  if (checkboxes[i].checked) {
                      checkboxesChecked.push(checkboxes[i]);
                      ids = ids + checkboxes[i].getAttribute("Name") + ",";
                  }
              }
              // Return the array if it is non-empty, or null
              //return checkboxesChecked.length &gt; 0 ? checkboxesChecked : null;
              return ids;
          }
      }
  );`
  </code></pre>
  
  <p>Any help is appreciated. I have tried everything that google has thrown my way (which has been mostly stackoverflow sites) and I am still having the same problem.</p>