Uncaught TypeError jqute

I am trying to make a really simple html tableTree. I have no experience regarding html/javascript programming so I'm traversing google to find examples on what I'm trying to achive.

I am currently trying to find an easy way to pass a json file into an html document, and I have been successfull by doing that code part my self and using ajax and jquery.

However I have found an example using jqote2, though implementing this example gives me an error "Uncaught TypeError: undefined is not a function". I guess I'm missing something though i cannot figure out what so I'm hoping I could get some assistance here :)

<!DOCTYPE html>
<html>
<head>
  <script src="jquery/jquery-1.11.2.min.js"></script>
  <script src="jqote2/jquery.jqote2.js"></script>
  <script type="text/html" id="template">
  <![CDATA[
    <tr>
      <td class="no"><%= j+1 %></td>
      <td class="title"><%= this.Title %></td>
    </tr>
  ]]>
  </script> 
  <!-- 2 load the theme CSS file -->
  <title>Test</title>
  </head>

  <body>
  <script type="text/javascript">
    var jsondata = [{"Title": "Dr.", "Surname": "House", "Firstname":  "Geronimo"},{"Title": "Mr.", "Surname": "Franklin", "Firstname": "Benjamin"}];
    // Now call jQote on the template providing your json data
    $('#template').jqote(jsondata).appendTo($('#users'));
  </script>

  <div>
    <table id="users"></table>
  </div>

</body>
</html>

I've build this code based on the example found at http://aefxx.com/jquery-plugin/jqote/

When running this code i get the error on

$('#template').jqote(jsondata).appendTo($('#users'));

So what am I missing :) I've check and the included files does exist and the path is correct.

Solution

you have a problem in the CData section Characters like "<" and "&" are illegal in XML elements.

"<" will generate an error because the parser interprets it as the start of a new element.

"&" will generate an error because the parser interprets it as the start of an character entity.

Some text, like JavaScript code, contains a lot of "<" or "&" characters. To avoid errors script code can be defined as CDATA.

Everything inside a CDATA section is ignored by the parser. moveover you can't write string as you did

http://www.w3schools.com/xml/xml_cdata.asp

drawing a table from json object would go like this

<!DOCTYPE html>
<html>
<head>
  <script src="jquery-1.11.2.min.js"></script>

  <!-- 2 load the theme CSS file -->
  <title>Test</title>
  </head>


  <script type="text/javascript">
    var jsondata = [{"Title": "Dr.", "Surname": "House", "Firstname":  "Geronimo"},{"Title": "Mr.", "Surname": "Franklin", "Firstname": "Benjamin"}];
    // Now call jQote on the template providing your json data

    $( document ).ready(function() {
       $.each( jsondata, function( key, value ) {
            $.each( value, function( k, v ) {
                    $("#"+k).html(v);

            });
    });
});

  </script>

   <body>
  <table>
  <tr>
  <td id="Title"></td>
  <td id="Surname"></td>
  <td id="House"></td>
  <td id="Firstname"></td>
  </tr>
  </table>

</body>
</html>

the first loop will cut down the object into arrays , the second one will let you get the keys and values and then do what you want with them ^_^ hope this help