Fix for BorisMoore#41 issue in IE8

jmmaranan · Mar 11, 2012 · ae70faf · ae70faf
1 parent bf3e4fe
commit ae70faf
Show file tree

Hide file tree

Showing 5 changed files with 49 additions and 49 deletions.
diff --git a/demos/jQueryConfDemosOct2011/07_observable.html b/demos/jQueryConfDemosOct2011/07_observable.html
@@ -41,7 +41,7 @@ <h3>8 Observable property changes: JsViews</h3>
 $.templates( "personTmpl", "#personTmpl" );
 
 // Data-link details container to person, using the personTmpl template
-$.link.personTmpl( "#details", person , {link:false});
+$.link.personTmpl( "#details", person );
 
 // Observable property change
 $( "#changeName" ).click( function() {

diff --git a/demos/jQueryConfDemosOct2011/14_custom-tags.html b/demos/jQueryConfDemosOct2011/14_custom-tags.html
@@ -46,11 +46,11 @@ <h3>17 Custom tags for rendering</h3>
 			if ( this.props.reverse ) {
 				// Render in reverse order
 				for ( var i = array.length; i; i-- ) {
-					ret += this.tmpl.render( array[ i - 1 ] );
+					ret += this.renderContent( array[ i - 1 ] );
 				}		
 			} else {
 				// Render in original order
-				ret += this.tmpl.render( array );
+				ret += this.renderContent( array );
 			}
 			return ret;
 		}

diff --git a/demos/step-by-step/01_rendering-and-linking.html b/demos/step-by-step/01_rendering-and-linking.html
@@ -42,7 +42,7 @@ <h4>Use JsViews to link content of an HTML container element directly to data, b
 <script type="text/javascript">
 
 	var movies = [
-		{ name: "The <b>Red</b> Violin", releaseYear: "1998" },
+		{ name: "The Red Violin", releaseYear: "1998" },
 		{ name: "Eyes Wide Shut", releaseYear: "1999" },
 		{ name: "The Inheritance", releaseYear: "1976" }
 	];

diff --git a/demos/step-by-step/10_todos.html b/demos/step-by-step/10_todos.html
@@ -47,39 +47,40 @@ <h1>Todos</h1>
 <script>
 (function(){
 	// Initialize app
-	Todos = {
-		items: $.parseJSON( localStorage.getItem( "JsViewsTodos" )) || [], //	Intialize from local storage
-		edit: function( view ) {
-			view.tmpl = "editTemplate";
-			view.render();
-			$( view.nodes ).find('input').focus();
-		},
-		removeItem: function( index, item ) {
-			$.observable( this.items ).remove( index, 1 );
-			this.doneChanged( item.done ? -1 : 0 );
-		},
-		clearCompleted: function( index ) {
-			var l = this.items.length;
-			while ( l-- ) {
-				if ( this.items[ l ].done ) {
-					this.removeItem( l, this.items[ l ]);
+	var useStorage = window.JSON && window.localStorage,
+		todos = {
+			items: useStorage && $.parseJSON( localStorage.getItem( "JsViewsTodos" )) || [], //	Intialize from local storage
+			edit: function( view ) {
+				view.tmpl = "editTemplate";
+				view.render();
+				$( view.nodes ).find('input').focus();
+			},
+			removeItem: function( index, item ) {
+				$.observable( this.items ).remove( index, 1 );
+				this.doneChanged( item.done ? -1 : 0 );
+			},
+			clearCompleted: function( index ) {
+				var l = this.items.length;
+				while ( l-- ) {
+					if ( this.items[ l ].done ) {
+						this.removeItem( l, this.items[ l ]);
+					}
 				}
+			},
+			doneChanged: function( incr ) {
+				var completed = this.completed + incr;
+				$.observable( this ).setProperty({
+					remaining: this.items.length - completed,
+					completed: completed
+				});
+			},
+			contentChanged: function( view ) {
+				view.tmpl = "itemTemplate";
+				view.render();
 			}
-		},
-		doneChanged: function( incr ) {
-			var completed = this.completed + incr;
-			$.observable( this ).setProperty({
-				remaining: this.items.length - completed,
-				completed: completed
-			});
-		},
-		contentChanged: function( view ) {
-			view.tmpl = "itemTemplate";
-			view.render();
 		}
-	}
-	Todos.completed = $( Todos.items ).filter( function( index, val ) { return val.done; }).length;
-	Todos.remaining = Todos.items.length - Todos.completed;
+		todos.completed = $( todos.items ).filter( function( index, val ) { return val.done; }).length;
+		todos.remaining = todos.items.length - todos.completed;
 
 	// Helper functions
 	$.views.helpers({
@@ -96,13 +97,15 @@ <h1>Todos</h1>
 					var view = $.view( this.src );
 					switch( this.path ) {
 						case "done":
-							Todos.doneChanged( view.data.done ? 1 : -1 );
+							todos.doneChanged( view.data.done ? 1 : -1 );
 							break;
 						case "content":
-							Todos.contentChanged( view );
+							todos.contentChanged( view );
 					}
 				case "arrayChange":
-					localStorage.setItem( "JsViewsTodos", JSON.stringify( Todos.items ));
+					if ( useStorage ) {
+						localStorage.setItem( "JsViewsTodos", JSON.stringify( todos.items ));
+					}
 			}
 		}
 	});
@@ -114,28 +117,28 @@ <h1>Todos</h1>
 	});
 
 //	Link UI, and handle changes to 'done' and 'content' properties of Todo items
-	$.link.itemTemplate( "#todo-list", Todos.items );
-	$.link( "#todo-stats", Todos );
+	$.link.itemTemplate( "#todo-list", todos.items );
+	$.link( "#todo-stats", todos );
 
 	// UI Event bindings
 	$( "#new-todo" ).keypress( function( ev ) {
 		if ( ev.keyCode === 13 ) {
-			$.observable( Todos.items ).insert( Todos.items.length, { content: this.value, done: false });
-			Todos.doneChanged( 0 );
+			$.observable( todos.items ).insert( todos.items.length, { content: this.value, done: false });
+			todos.doneChanged( 0 );
 			this.value = "";
 		}
 	});
 	$( "#todo-list" )
 		.delegate( ".todo-destroy", "click", function() {
 			var view = $.view( this );
-			Todos.removeItem( view.index, view.data );
+			todos.removeItem( view.index, view.data );
 		})
 		.delegate( "li", "dblclick", function( ev ) {
-			Todos.edit( $.view( this ));
+			todos.edit( $.view( this ));
 		})
 		.delegate( "input", "keypress", function( ev ) { if (ev.keyCode === 13){ this.blur(); }});
 
-	$( ".todo-clear" ).click( function() { Todos.clearCompleted(); });
+	$( ".todo-clear" ).click( function() { todos.clearCompleted(); });
 })();
 </script>
 </body>

diff --git a/jquery.views.js b/jquery.views.js
@@ -40,10 +40,6 @@ var versionNumber = "v1.0pre",
 	rTmplOrItemComment = /^(\/?)(?:(item)|(?:(tmpl)(?:\(([^,)]*),([^,)]*)\))?(?:\s+([^\s]+))?))$/,
 	rStartTag = /^item|^tmpl(\(\$?[\w.,]*\))?(\s+[^\s]+)?$/;
 
-//====================
-// Linked View Methods
-//====================
-
 if ( !$.fn ) {
 	// jQuery is not loaded.
 	throw "requires jQuery"; // for Beta (at least) we require jQuery
@@ -767,7 +763,8 @@ $.extend({
 		if ( template ) {
 			// TODO/BUG Currently this will re-render if called a second time, and will leave stale views under the parentView.views.
 			// So TODO: make it smart about when to render and when to link on already rendered content
-			container.html( template.render( data, context, parentView )); // Supply non-jQuery version of this...
+			container.empty().append( template.render( data, context, parentView )); // Supply non-jQuery version of this...
+			// Using append, rather than html, as workaround for issues in IE compat mode. (Using innerHTML leads to initial comments being stripped)
 		}
 		linkViews( container[0], parentView, undefined, undefined, data, context );
 	},