Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Added 'remove' example on 'Observable collection changes' samples.

Switched all samples to use $(...).on() rather thatn $(...).click()
  • Loading branch information...
commit cf89d9dfc5b5d64332702088aa780811b9de1321 1 parent 16fea05
@BorisMoore authored
View
4 demos/jQueryConfDemosOct2011/07_observable.html
@@ -44,7 +44,7 @@
$.link.personTmpl( person, "#details" );
// Observable property change
-$( "#changeName" ).click( function() {
+$( "#changeName" ).on( "click", function() {
$.observable( person ).setProperty( "firstName", person.firstName + "Plus" );
});
@@ -68,7 +68,7 @@
$.link.personTmpl( person, "#details" );
// Observable property change
-$( "#changeName" ).click( function() {
+$( "#changeName" ).on( "click", function() {
$.observable( person ).setProperty( "firstName", person.firstName + "Plus" );
});
</pre>
View
24 demos/jQueryConfDemosOct2011/07_observable2.html
@@ -27,6 +27,9 @@
<td>
<input data-link="firstName" />
</td>
+ <td>
+ <img class="close" src="../resources/close.png" />
+ </td>
</tr>
</script>
@@ -49,11 +52,17 @@
// Data-link details container to people, using the personTmpl template
$.link.personTmpl( people, "#details" );
-// Observable array change
-$( "#insertPerson" ).click( function() {
+// Observable array change: insert
+$( "#insertPerson" ).on( "click", function() {
$.observable( people ).insert( 0, { firstName: "NewPerson" + counter++ });
});
+// Observable array change: remove
+$( "#details" )
+ .on( "click", ".close", function() {
+ $.observable( people ).remove( $.view( this ).index, 1 );
+ });
+
</script>
<!--================ End of Demo Section ================-->
@@ -72,10 +81,17 @@
<pre class="brush: js;">
$.link.personTmpl( people, "#details" );
-// Observable array change
-$( "#insertPerson" ).click( function() {
+// Observable array change: insert
+$( "#insertPerson" ).on( "click", function() {
$.observable( people ).insert( 0, { firstName: "NewPerson" + counter++ });
});
+
+// Observable array change: remove
+$( "#details" )
+ .on( "click", ".close", function() {
+ $.observable( people ).remove( $.view( this ).index, 1 );
+ });
+
</pre>
</body>
</html>
View
18 demos/jQueryConfDemosOct2011/07_observable3.html
@@ -36,6 +36,9 @@
<td>
<input data-link="firstName" />
</td>
+ <td>
+ <img class="close" src="../resources/close.png" />
+ </td>
</tr>
</script>
@@ -63,15 +66,22 @@
$.link.personTmpl2( people, "#details2" );
// Observable array change: insert two new people
-$( "#insertPerson" ).click( function() {
+$( "#insertPerson" ).on( "click", function() {
+ var insertAt = people.length ? 1 : 0;
$.observable( people ).insert(
- 1, // insert at index 1
+ insertAt, // insert at index 1
[
{ firstName: "NewPerson" + counter++ },
{ firstName: "NewPerson" + counter++ }
]);
});
+// Observable array change: remove
+$( "#details2" )
+ .on( "click", ".close", function() {
+ $.observable( people ).remove( $.view( this ).index, 1 );
+ });
+
</script>
<!--================ End of Demo Section ================-->
@@ -83,9 +93,9 @@
$.link.personTmpl2( people, "#details2" );
// Observable array change: insert two new people at index 1
-$( "#insertPerson" ).click( function() {
+$( "#insertPerson" ).on( "click", function() {
$.observable( people ).insert(
- 1, // index 1
+ 1, // index 1
[ // add two new people
{ firstName: "NewPerson" },
{ firstName: "NewPerson2" }
View
2  demos/jQueryConfDemosOct2011/11_editable-data.html
@@ -113,7 +113,7 @@
return false;
});
- $( "#addMovieBtn" ).click( function() {
+ $( "#addMovieBtn" ).on( "click", function() {
$.observable( movies ).insert( movies.length, {
title: "NewTitle" + counter,
languages: [
View
2  demos/jQueryConfDemosOct2011/13_converters.html
@@ -73,7 +73,7 @@
});
// Observable property change
-$( "#changeDay" ).click( function() {
+$( "#changeDay" ).on( "click", function() {
var dayOff = myWeek.dayOff;
$.observable( myWeek ).setProperty( "dayOff", dayOff < 6 ? dayOff + 1 : 0);
});
View
2  demos/step-by-step/04_editable-data.html
@@ -101,7 +101,7 @@
return false;
});
- $( "#addMovieBtn" ).click( function() {
+ $( "#addMovieBtn" ).on( "click", function() {
$.observable( movies ).insert( movies.length, {
title: "NewTitle" + counter ,
languages: [
View
2  demos/step-by-step/05_server-rendered_client-activated.html
@@ -156,7 +156,7 @@
return false;
});
- $( "#addMovieBtn" ).click( function() {
+ $( "#addMovieBtn" ).on( "click", function() {
$.observable( movies ).insert( movies.length, {
title: "NewTitle" + counter,
languages: [
View
2  demos/step-by-step/10_todos.html
@@ -128,7 +128,7 @@
}
});
- $( ".todo-clear" ).click( function() { todos.clearCompleted(); });
+ $( ".todo-clear" ).on( "click", function() { todos.clearCompleted(); });
// Link UI, and handle changes to 'done' and 'content' properties of Todo items
$.link( todos, "#todo-stats" );
Please sign in to comment.
Something went wrong with that request. Please try again.