js-AJAX-calls now work in subfolder

jaonoctus · Nov 9, 2014 · 4c0dd2a · 4c0dd2a
1 parent a3dc1fd
commit 4c0dd2a
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 4 deletions.
diff --git a/application/views/_templates/footer.php b/application/views/_templates/footer.php
@@ -1,6 +1,12 @@
     <!-- jQuery, loaded in the recommended protocol-less way -->
     <!-- more http://www.paulirish.com/2010/the-protocol-relative-url/ -->
     <script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
+
+    <!-- define the project's URL (to make AJAX calls possible, even when using this in sub-folders etc) -->
+    <script>
+        var url = "<?php echo URL; ?>";
+    </script>
+
     <!-- our JavaScript -->
     <script src="<?php echo URL; ?>js/application.js"></script>
 </body>

diff --git a/public/js/application.js b/public/js/application.js
@@ -1,8 +1,8 @@
 $(function() {
 
-    // TODO can a JS expert write this code like it should look like ?
+    // just a super-simple JS demo
 
-	var demoHeaderBox;
+    var demoHeaderBox;
 
     // simple demo to show create something via javascript on the page
     if ($('#javascript-header-demo-box').length !== 0) {
@@ -20,8 +20,8 @@ $(function() {
         $('#javascript-ajax-button').on('click', function(){
 
             // send an ajax-request to this URL: current-server.com/songs/ajaxGetStats
-            // TODO this will not work directly when using the project in a sub-folder
-            $.ajax("/songs/ajaxGetStats")
+            // "url" is defined in views/_templates/footer.php
+            $.ajax(url + "/songs/ajaxGetStats")
                 .done(function(result) {
                     // this will be executed if the ajax-call was successful
                     // here we get the feedback from the ajax-call (result) and show it in #javascript-ajax-result-box