title: backbone.js router
body: <p>I would like to go to one of the links below the code:</p>
  
  <pre><code>    var  menukeuze;
  
     var AppRouter = Backbone.Router.extend({
          routes: {
              "menukeuze": "getPost",
              "*actions": "defaultRoute" // matches http://example.com/#anything-here
          }
      });
      // Instantiate the router
      var app_router = new AppRouter;
      app_router.on('route:getPost', function (menukeuze) {
          // Note the variable in the route definition being passed in here
          if (menukeuze == 'Welkom') { MakeRequest_goto(menukeuze); }
          if (menukeuze == 'Dogs1') { MakeRequest_goto(menukeuze); }
          if (menukeuze == 'Dogs2') { MakeRequest_goto(menukeuze); }
      });
      app_router.on('route:defaultRoute', function (actions) {
          MakeRequest_goto('Welkom');
      });
      // Start Backbone history a necessary step for bookmarkable URL's
      Backbone.history.start();
  
  function MakeRequest_goto (ganaarpagina) {
                      $(document).ready(function() {
                      $('#div-main-content').fadeOut(function() { $.ajaxSetup( {
                      cache: false,
                      beforeSend: function() {
                      $('#div-main-content').fadeOut();
  //                $('#content').hide();
  //                $('#loading').show();
                      },
                      complete: function() {
  //                $('#loading').hide();
  //                $('#content').show();
                      },
                      success: function() {
  //                $('#loading').hide();
                    $('#div-main-content').fadeIn();
  //                  $('#div-main-content').show();
              }
          });
                      var $container = $("#div-main-content");
              //        $container.load(MakeRequest);
                      alert ("Loading: " + "page_" + ganaarpagina + ".php");
                              $container.load("page_" + ganaarpagina + ".php");
                  }); }); }
  </code></pre>
  
  <p>I call these routes via:</p>
  
  <pre><code>&lt;td&gt;
   &lt;a href="#/menu/Welkom" &gt;
   &lt;img src="images/test1.png" /&gt;
   &lt;/td&gt;
  
  &lt;td&gt;
   &lt;a href="#/menu/Dogs1" &gt;
   &lt;img src="images/test2.png" /&gt;
  &lt;/td&gt;
  
  &lt;td&gt;
   &lt;a href="#/menu/Dogs2" &gt;
   &lt;img src="images/test3.png" /&gt;
  &lt;/td&gt;
  </code></pre>
  
  <p>When I type in the browser <a href="http://link.nl/#/menu/Welkom" rel="nofollow noreferrer">http://link.nl/#/menu/Welkom</a> I get a perfect page, but the url looses the #. When I refresh the page, the webserver says: the requested URL is not found.
  (this is because the URL changed from with "#" to without "#".)
  When I click one of the href's it never works and I receive a :
  GET <a href="http://link.nl/Welkom?_=1365638638131" rel="nofollow noreferrer">http://link.nl/Welkom?_=1365638638131</a> 404 (Not Found) </p>
  
  <p>How can I load ajax via these routed URL's?
  I've tried the setup and information of the following sites, but non did help:</p>
  
  <p><a href="http://thomasdavis.github.io/examples/restful-app/" rel="nofollow noreferrer">http://thomasdavis.github.io/examples/restful-app/</a></p>
  
  <p><a href="http://jsfiddle.net/ambiguous/xkZtB/" rel="nofollow noreferrer">http://jsfiddle.net/ambiguous/xkZtB/</a></p>
  
  <p><a href="https://stackoverflow.com/questions/13101905/backbone-router-listener-not-hitting-hash-tag">Backbone router listener not hitting hash tag</a></p>
  
  <p>I've triend many more, but they end up the same, or don't have any "completed info".
  I hope someone sees my problem?
  The browser I'm using is: Chrome v26 on OSX.</p>
  
  <p>The java scripts I'm using are:</p>
  
  <pre><code>&lt;script src="http:////ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="http:////ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.min.js"&gt;&lt;/script&gt;
  &lt;script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"&gt;&lt;/script&gt;
  &lt;script src='http://underscorejs.org/underscore-min.js'&gt;&lt;/script&gt;
  &lt;script src='http://documentcloud.github.io/backbone/backbone-min.js'&gt;&lt;/script&gt;
  </code></pre>
  
  <p>The default route is working when I browse to the <a href="http://link.nl/" rel="nofollow noreferrer">http://link.nl/</a> site.
  Link.nl is not a real site, just as an example.
  Regards,</p>