Skip to content
This repository has been archived by the owner on Dec 19, 2024. It is now read-only.

Commit

Permalink
add form reset for dynamicaly enabled / disabled elements
Browse files Browse the repository at this point in the history
  • Loading branch information
@200Puls
200Puls committed Aug 1, 2019
1 parent 17f0c67 commit 59cd2e2
Show file tree
Hide file tree
Showing 2 changed files with 50 additions and 19 deletions.
44 changes: 26 additions & 18 deletions iron-form.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -249,7 +249,7 @@ Polymer({
* @return {void}
*/
_saveInitialValues: function(overwriteValues) {
var nodes = this._getValidatableElements();
var nodes = this._getResettableElements();
for (var i = 0; i < nodes.length; i++) {
var node = nodes[i];
if (!this._defaults.has(node) || overwriteValues) {
Expand Down Expand Up @@ -374,7 +374,7 @@ Polymer({
}

// Load the initial values.
var nodes = this._getValidatableElements();
var nodes = this._getResettableElements();
for (var i = 0; i < nodes.length; i++) {
var node = nodes[i];
if (this._defaults.has(node)) {
Expand Down Expand Up @@ -449,14 +449,19 @@ Polymer({
}
},

_getResettableElements: function() {
return this._findElements(
this._form, true /* ignoreName */, false /* skipSlots */, true /* ignoreDisabled */);
},

_getValidatableElements: function() {
return this._findElements(
this._form, true /* ignoreName */, false /* skipSlots */);
this._form, true /* ignoreName */, false /* skipSlots */, false /* ignoreDisabled */);
},

_getSubmittableElements: function() {
return this._findElements(
this._form, false /* ignoreName */, false /* skipSlots */);
this._form, false /* ignoreName */, false /* skipSlots */, false /* ignoreDisabled */);
},

/**
Expand All @@ -465,21 +470,22 @@ Polymer({
* @param {!Node} parent The parent node
* @param {!boolean} ignoreName Whether the name of the submittable nodes should be disregarded
* @param {!boolean} skipSlots Whether to skip traversing of slot elements
* @param {!boolean} ignoreDisabled Whether the disabled state of the submittable nodes should be disregarded.
* @param {!Array<!Node>=} submittable Reference to the array of submittables
* @return {!Array<!Node>}
* @private
*/
_findElements: function(parent, ignoreName, skipSlots, submittable) {
_findElements: function(parent, ignoreName, skipSlots, ignoreDisabled, submittable) {
submittable = submittable || [];
var nodes = dom(parent).querySelectorAll('*');
for (var i = 0; i < nodes.length; i++) {
// An element is submittable if it is not disabled, and if it has a
// name attribute.
if (!skipSlots &&
(nodes[i].localName === 'slot' || nodes[i].localName === 'content')) {
this._searchSubmittableInSlot(submittable, nodes[i], ignoreName);
this._searchSubmittableInSlot(submittable, nodes[i], ignoreName, ignoreDisabled);
} else {
this._searchSubmittable(submittable, nodes[i], ignoreName);
this._searchSubmittable(submittable, nodes[i], ignoreName, ignoreDisabled);
}
}
return submittable;
Expand All @@ -491,10 +497,11 @@ Polymer({
* @param {!Array<!Node>} submittable Reference to the array of submittables
* @param {!Node} node The slot or content node
* @param {!boolean} ignoreName Whether the name of the submittable nodes should be disregarded
* @param {!boolean} ignoreDisabled Whether the disabled state of the submittable nodes should be disregarded.
* @return {void}
* @private
*/
_searchSubmittableInSlot: function(submittable, node, ignoreName) {
_searchSubmittableInSlot: function(submittable, node, ignoreName, ignoreDisabled) {
var assignedNodes = dom(node).getDistributedNodes();

for (var i = 0; i < assignedNodes.length; i++) {
Expand All @@ -504,11 +511,11 @@ Polymer({

// Note: assignedNodes does not contain <slot> or <content> because
// getDistributedNodes flattens the tree.
this._searchSubmittable(submittable, assignedNodes[i], ignoreName);
this._searchSubmittable(submittable, assignedNodes[i], ignoreName, ignoreDisabled);
var nestedAssignedNodes = dom(assignedNodes[i]).querySelectorAll('*');
for (var j = 0; j < nestedAssignedNodes.length; j++) {
this._searchSubmittable(
submittable, nestedAssignedNodes[j], ignoreName);
submittable, nestedAssignedNodes[j], ignoreName), ignoreDisabled;
}
}
},
Expand All @@ -519,15 +526,16 @@ Polymer({
* @param {!Array<!Node>} submittable Reference to the array of submittables
* @param {!Node} node The node to be
* @param {!boolean} ignoreName Whether the name of the submittable nodes should be disregarded
* @param {!boolean} ignoreDisabled Whether the disabled state of the submittable nodes should be disregarded.
* @return {void}
* @private
*/
_searchSubmittable: function(submittable, node, ignoreName) {
if (this._isSubmittable(node, ignoreName)) {
_searchSubmittable: function(submittable, node, ignoreName, ignoreDisabled) {
if (this._isSubmittable(node, ignoreName, ignoreDisabled)) {
submittable.push(node);
} else if (node.root) {
this._findElements(
node.root, ignoreName, true /* skipSlots */, submittable);
node.root, ignoreName, true /* skipSlots */, ignoreDisabled, submittable);
}
},

Expand All @@ -539,14 +547,14 @@ Polymer({
* we don't search for validatables in its shadowRoot.
* @param {!Node} node
* @param {!boolean} ignoreName
* @param {!boolean} ignoreDisabled Whether the disabled state of the submittable nodes should be disregarded.
* @return {boolean}
* @private
*/
_isSubmittable: function(node, ignoreName) {
return (
!node.disabled &&
(ignoreName ? node.name || typeof node.validate === 'function' :
node.name));
_isSubmittable: function(node, ignoreName, ignoreDisabled) {
return (
(ignoreDisabled || !node.disabled) &&
(ignoreName ? node.name || typeof node.validate === 'function' : node.name));
},

_serializeElementValues: function(element) {
Expand Down
25 changes: 24 additions & 1 deletion test/basic.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -240,6 +240,17 @@
</template>
</test-fixture>

<test-fixture id="reset-disabled">
<template>
<iron-form>
<form action="/get" method="get">
<paper-input name="paper1" id="disabled_element" value="paper1" disabled="true"></paper-input>
<input type="reset">
</form>
</iron-form>
</template>
</test-fixture>

<test-fixture id="content-type">
<template>
<div>
Expand Down Expand Up @@ -900,7 +911,19 @@
expect(document.getElementById('paper_0').value).to.be.equal('input');
done();
}, 1);
});
});

test('reset a dynamically enabled element', function(done) {
var form = fixture('reset-disabled');
form.saveResetValues();
Base.async(function() {
document.getElementById('disabled_element').disabled = false;
document.getElementById('disabled_element').value = 'input1++';
form.reset();
expect(document.getElementById('disabled_element').value).to.be.equal('paper1');
done();
}, 1);
})

test('fires reset and iron-form-reset events', function(done) {
var form = fixture('resetting');
Expand Down

0 comments on commit 59cd2e2

Please sign in to comment.