Redo not_inline.html to get template via ajax.

Author: akavlie

not_inline.html

@@ -15,23 +15,15 @@
             { Name: "Eyes Wide Shut", ReleaseYear: "1999", Director: "Stanley Kubrick" },
             { Name: "The Inheritance", ReleaseYear: "1976", Director: "Mauro Bolognini" }
             ];
-        </script>
-
-
-        <script id="summaryTemplate" src="template.html" type="text/x-jquery-tmpl"></script>
-
-
-        <script>
-            function renderList() {
-                $( "#summaryTemplate" ).tmpl( movies ).appendTo( "#moviesList" );
-            }
-        </script>
-
-
-        <script>
-            $(function(){
-                $('#showBtn').click(function(data){
-                    renderList();
+            
+            $(function() {
+                $.get('template.html', function(tmpl) {
+                    var output = $.tmpl(tmpl, movies);
+
+                    $('#showBtn').click(function(e) {
+                        e.preventDefault();
+                        output.appendTo('#moviesList');
+                    });
                 });
             });
         </script>

template.html

@@ -1,3 +1 @@
-<script id="summaryTemplate" type="text/x-jquery-tmpl">
-    <tr> <td>${Name}</td> <td>${ReleaseYear}</td> <td>${Director}</td> </tr>
-</script>
+<tr> <td>${Name}</td> <td>${ReleaseYear}</td> <td>${Director}</td> </tr>