Permalink
Browse files

Form Reset: Add form reset mixin

Fixes #12638
Closes gh-1555
  • Loading branch information...
1 parent 556b271 commit ad98cb167350b8d929b71bfeefc904c8964893dd @scottgonzalez scottgonzalez committed Apr 23, 2015
View
@@ -25,6 +25,7 @@
"draggable/draggable.html",
"droppable/droppable.html",
"effects/effects.html",
+ "form-reset-mixin/form-reset-mixin.html",
"menu/menu.html",
"position/position.html",
"progressbar/progressbar.html",
@@ -0,0 +1,26 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <meta charset="utf-8">
+ <title>jQuery UI Form Reset Mixin Test Suite</title>
+
+ <script src="../../../external/jquery/jquery.js"></script>
+
+ <link rel="stylesheet" href="../../../external/qunit/qunit.css">
+ <link rel="stylesheet" href="../../../external/qunit-composite/qunit-composite.css">
+ <script src="../../../external/qunit/qunit.js"></script>
+ <script src="../../../external/qunit-composite/qunit-composite.js"></script>
+ <script src="../subsuite.js"></script>
+
+ <script>
+ testAllVersions( "form-reset-mixin" );
+ </script>
+</head>
+<body>
+
+<div id="qunit"></div>
+<div id="qunit-fixture">
+
+</div>
+</body>
+</html>
@@ -0,0 +1,95 @@
+define( [
+ "jquery",
+ "lib/common",
+ "ui/widget",
+ "ui/form-reset-mixin"
+], function( $, common ) {
+
+module( "widget factory", {
+ setup: function() {
+ $.widget( "ui.testWidget", [ $.ui.formResetMixin, {
+ _create: function() {
+ this._bindFormResetHandler();
+ },
+ _destroy: function() {
+ this._unbindFormResetHandler();
+ },
+ refresh: function() {
+ $.ui.testWidget.refreshed.push( this.element.attr( "id" ) );
+ }
+ } ] );
+
+ $.ui.testWidget.refreshed = [];
+ },
+
+ teardown: function() {
+ delete $.ui.testWidget;
+ delete $.fn.testWidget;
+ }
+});
+
+common.testJshint( "form-reset-mixin" );
+
+asyncTest( "form reset", function() {
+ expect( 2 );
+
+ var form = $( "#main" );
+ var inputs = form.find( "input" );
+
+ inputs.testWidget();
+ form.on( "reset", function() {
+ setTimeout(function() {
+ deepEqual( $.ui.testWidget.refreshed, [ "input1", "input2", "input3", "input4" ],
+ "All widgets are refreshed on form reset" );
+ equal( form.data( "ui-form-reset-instances" ).length, 4,
+ "All widget instances are tracked against the form" );
+ start();
+ } );
+ } );
+ form[ 0 ].reset();
+} );
+
+asyncTest( "destroy", function() {
+ expect( 2 );
+
+ var form = $( "#main" );
+ var inputs = form.find( "input" );
+
+ inputs
+ .testWidget()
+ .eq( 1 )
+ .testWidget( "destroy" );
+
+ form.on( "reset", function() {
+ setTimeout(function() {
+ deepEqual( $.ui.testWidget.refreshed, [ "input1", "input3", "input4" ],
+ "All widgets are refreshed on form reset" );
+ deepEqual( form.data( "ui-form-reset-instances" ).length, 3,
+ "All widget instances are tracked against the form" );
+ start();
+ } );
+ } );
+ form[ 0 ].reset();
+} );
+
+asyncTest( "destroy all", function() {
+ expect( 2 );
+
+ var form = $( "#main" );
+
+ form.find( "input" )
+ .testWidget()
+ .testWidget( "destroy" );
+
+ form.on( "reset", function() {
+ setTimeout(function() {
+ deepEqual( $.ui.testWidget.refreshed, [], "No widgets are refreshed after destroy" );
+ strictEqual( form.data( "ui-form-reset-instances" ), undefined,
+ "Form data is removed when the last widget instance is destroyed" );
+ start();
+ } );
+ } );
+ form[ 0 ].reset();
+} );
+
+} );
@@ -0,0 +1,26 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <meta charset="utf-8">
+ <title>jQuery UI Form Reset Mixin Test Suite</title>
+
+ <script src="../../../external/requirejs/require.js"></script>
+ <script src="../../lib/css.js"></script>
+ <script src="../../lib/bootstrap.js" data-modules="core">
+ </script>
+</head>
+<body>
+
+<div id="qunit"></div>
+<div id="qunit-fixture">
+
+<form id="main">
+ <input id="input1">
+ <input id="input2">
+ <input id="input3">
+ <input id="input4">
+</form>
+
+</div>
+</body>
+</html>
@@ -0,0 +1,62 @@
+( function( factory ) {
+ if ( typeof define === "function" && define.amd ) {
+
+ // AMD. Register as an anonymous module.
+ define( [
+ "jquery",
+ "ui/core"
+ ], factory );
+ } else {
+
+ // Browser globals
+ factory( jQuery );
+ }
+}( function( $ ) {
+
+return $.ui.formResetMixin = {
+ _formResetHandler: function() {
+ var form = $( this );
+
+ // Wait for the form reset to actually happen before refreshing
+ setTimeout( function() {
+ var instances = form.data( "ui-form-reset-instances" );
+ $.each( instances, function() {
+ this.refresh();
+ } );
+ } );
+ },
+
+ _bindFormResetHandler: function() {
+ this.form = this.element.form();
+ if ( !this.form.length ) {
+ return;
+ }
+
+ var instances = this.form.data( "ui-form-reset-instances" ) || [];
+ if ( !instances.length ) {
+
+ // We don't use _on() here because we use a single event handler per form
+ this.form.on( "reset.ui-form-reset", this._formResetHandler );
+ }
+ instances.push( this );
+ this.form.data( "ui-form-reset-instances", instances );
+ },
+
+ _unbindFormResetHandler: function() {
+ if ( !this.form.length ) {
+ return;
+ }
+
+ var instances = this.form.data( "ui-form-reset-instances" );
+ instances.splice( $.inArray( this, instances ), 1 );
+ if ( instances.length ) {
+ this.form.data( "ui-form-reset-instances", instances );
+ } else {
+ this.form
+ .removeData( "ui-form-reset-instances" )
+ .off( "reset.ui-form-reset" );
+ }
+ }
+};
+
+} ) );

0 comments on commit ad98cb1

Please sign in to comment.