Rails Capistrano Help: learning javascript

Mar 22, 2015

[SOLVED] Uncaught TypeError: Cannot set property 'innerHTML' of null

This happens when your innerHTML code is trying to insert into a html element/tag that doesn't exist or named differently.

The code below will produce error - the HTML doesn't have an element with the id "result":

HTML -



<body> 

<header></header>

  <div id="main">

  </div>

  <footer></footer>



  <script>

     var person = {

         firstName: "John",

         lastName : "Doe",

         id       : 5566,

         fullName : function(c) {

            return 'My name is ' + this.firstName + " " + this.lastName;

         }

     };

     document.getElementById("result").innerHTML = person.fullName ();

  </script>

</body>

This will work:

 <body>

<header></header>

<div id="main">

</div>

<footer></footer>



<script>

  var person = {

      firstName: "John",

      lastName : "Doe",

      id       : 5566,

      fullName : function(c) {

         return 'My name is ' + this.firstName + " " + this.lastName;

      }

  };

  document.getElementById("main").innerHTML = person.fullName ();

  </script>

</body>

Mar 21, 2015

[SOLVED] Uncaught Error: Bootstrap's JavaScript requires jQuery

This is quite a simple error you might encounter even when you've already included both jquery and bootstrap.js files.

Solution: Re-arrange the order of script tags in html file so that jquery is at the top, and bootstrap.js is anywhere after the jquery.js file.

This will cause the "uncaught error":

  <!-- js libs -->

  <!-- twbs jquery underscore backbone -->

  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>

  <script src="/js/lib/jquery-1.11.2.js"></script>

  <script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>

  <script src="http://documentcloud.github.com/backbone/backbone-min.js"></script>

Problem solved:



  <!-- js libs -->

  <!-- jquery twbs underscore backbone -->

  <script src="/js/lib/jquery-1.11.2.js"></script>

  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>

  <script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>

  <script src="http://documentcloud.github.com/backbone/backbone-min.js"></script>