2

I have a Javascript code to translate a few parts of my HTML page in other languages. You can read a few more details about it in another question I asked here: Multilanguage static website with JQuery

I have the same Javascript code in every HTML page in my website. In Home page (www.mywebsite.com) works, but in any other longer path (www.mywebsite.com/anotherpage) doesn't work. The weird here is that the code is totally missing from the source code of the page (right click --> view source code)

Here is a part of the code (the whole page is huge and I cannot paste it all)

<html lang="en">
   <head>   
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <!-- Le styles -->
      <link href="./static/css/bootstrap.min.css" rel="stylesheet">
      <link href="./static/css/slider.css" rel="stylesheet">
      <link rel="stylesheet" href="./static/css/font-awesome.css" />
      <link rel="stylesheet" href="./static/css/jquery-ui.css" />

   </head>
   <body>
   ....
   </body>
   <script src="./static/js/jquery.js"></script>
   <script src="./static/js/bootstrap.min.js"></script>
   <script src="./static/js/bootstrap-slider.js"></script>
   <script src="http://code.highcharts.com/highcharts.js"></script>
   <script src="./static/js/jquery.dataTables.min.js"></script>
   ! a few other script codes that works without a problem in this part !

   ! this is the one that is missing from the code
   <script type="text/javascript">

      function getCookie(name) {
         var nameEQ = name + "=";
         var ca = document.cookie.split(';');
         for(var i = 0; i < ca.length; i++) {
            var c = ca[i];
            while (c.charAt(0) == ' ') c = c.substring(1, c.length);
            if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
         }
         return null;
      }

      $(function() {

         var language = getCookie("language");
         if (language == null) {
            var language = 'English'
         }
         alert(language)
         $.ajax({
            url: './static/languages/languages.xml',
            success: function(xml) {
               $(xml).find('translation').each(function(){
                  var id = $(this).attr('id');
                  var text = $(this).find(language).text();
                  $("." + id).html(text);
               });
            }
         });
      });

   </script>

I have tried to put the script code on the top of the page, but I have the same problem. I have tried to put the full url on xml file without a success. I don't have any error on the console and the script doesn't run neither it is on the page source code.

SOLVED:

If I load the script code from an external file, then it works. The external file has exactly the same code, so it wasn't a typographic error.

Community
  • 1
  • 1
Tasos
  • 7,325
  • 18
  • 83
  • 176
  • 1
    `www.mywebsite.com/somepath` is not a *subdomain*! – Bergi Jun 11 '14 at 10:35
  • 1
    I used a wrong term. I mean a longer path than the home page. I will edit it. I didn't mean `sub.mywebsite.com` – Tasos Jun 11 '14 at 10:36
  • Check the network tab of your console. I'm pretty sure there's a request to `www.mywebsite.com/anotherpage/static/languages/languages.xml` which fails. – Bergi Jun 11 '14 at 10:36
  • instead of using src="./static/... use the www.mywebsite.com/..relative path here.../static/... – Elanchezhian Narayanasamy Jun 11 '14 at 10:38
  • @Bergi I checked there too, but there are only images and other scripts. Nothing about the xml file – Tasos Jun 11 '14 at 10:38
  • @ElanchezhianNarayanasamy in the end of my question, I say that I have tried to use the full url instead of `/static/...` – Tasos Jun 11 '14 at 10:40
  • Other scripts and css files are loading properly on subpages like `www.mywebsite.com/anotherpage`? Or do you have 404 errors in network tab when you open those pages? URLs with `./` are wrong in this case, so maybe reason those 2 functions are not in the source code is that they're appended to the source code dynamically by one of external scripts, which loads properly in `www.mywebsite.com` but not in `www.mywebsite.com/anotherpage`? – Wirone Jun 11 '14 at 11:19
  • @Wirone all the other scripts work without a problem. I wrote as a comment in one of the answers, that if I use the script as an external file, then it works. – Tasos Jun 11 '14 at 11:55
  • @AnastasiosVentouris strange, because it should not work this way (with `./` in src) for non-root requests (like www.mywebsite.com/anotherpage). The key thing is why code is missing, but you did not say anything about how you render page. – Wirone Jun 11 '14 at 15:44

2 Answers2

0

I think you can use <base> tag:

<head>
<base href="http://www.mywebsite.com/" target="_self">
</head>

or use "absolute" paths like <link href="/static/css/bootstrap.min.css" rel="stylesheet"> (without dot at the begining). If there is a dot at the begining it's considered to append to current path (in your example it gives www.mywebsite.com/anotherpage/static/css/bootstrap.min.css instead of www.mywebsite.com/static/css/bootstrap.min.css). The same rule is for ajax URL. See.

Additionally, that there is not any ajax request to xml file in your network tab is strictly related to... missing <script> (obviously...). But it's hard to tell why that script is missing, because you didn't provide information about how you generate html code (it's static html file or template? do you use any framework?).

Community
  • 1
  • 1
Wirone
  • 3,304
  • 1
  • 29
  • 48
-1

You should try to extract your functions into an external file, and reference it just like the rest:

<script src="../static/js/bootstrap-slider.js" type='text/javascript'></script>

Also, it's not considered good practice to include js code on an html page, your code can be deleted when removing html elements, etc.

Rafael
  • 1,099
  • 5
  • 23
  • 47
  • The problem is on the other script (with the two functions). Not in the initial scripts. – Tasos Jun 11 '14 at 10:41
  • Then you can put the functions in an external file, just like the others. It's not good practice to have js code on an html page anyway – Rafael Jun 11 '14 at 10:44
  • I don't know the reason but as an external file, suddenly it works :) If you edit your answer with the new details and an example, I could choose it as a best answer. But I cannot do it in its current form. – Tasos Jun 11 '14 at 10:50