From 03a16dd60336e015d1cf3c63d96e196d1010e370 Mon Sep 17 00:00:00 2001 From: xifengjin88 Date: Tue, 6 Feb 2018 21:05:53 -0500 Subject: [PATCH] added uniqueId for input field and its cooresponding label --- .../Editor/EditorControlPane/EditorControl.js | 6 ++- .../Editor/EditorControlPane/Widget.js | 4 +- yarn.lock | 40 ++++--------------- 3 files changed, 13 insertions(+), 37 deletions(-) diff --git a/src/components/Editor/EditorControlPane/EditorControl.js b/src/components/Editor/EditorControlPane/EditorControl.js index 4b8370b1..406e3540 100644 --- a/src/components/Editor/EditorControlPane/EditorControl.js +++ b/src/components/Editor/EditorControlPane/EditorControl.js @@ -1,5 +1,5 @@ import React from 'react'; -import { partial } from 'lodash'; +import { partial, uniqueId } from 'lodash'; import c from 'classnames'; import { resolveWidget } from 'Lib/registry'; import Widget from './Widget'; @@ -27,6 +27,7 @@ export default class EditorControl extends React.Component { const widgetName = field.get('widget'); const widget = resolveWidget(widgetName); const fieldName = field.get('name'); + const uniqueFieldId = uniqueId(); const metadata = fieldsMetaData && fieldsMetaData.get(fieldName); const errors = fieldsErrors && fieldsErrors.get(fieldName); return ( @@ -46,7 +47,7 @@ export default class EditorControl extends React.Component { 'nc-controlPane-labelActive': this.state.styleActive, 'nc-controlPane-labelWithError': !!errors, })} - htmlFor={fieldName} + htmlFor={fieldName + uniqueFieldId} > {field.get('label')} @@ -62,6 +63,7 @@ export default class EditorControl extends React.Component { classNameLabelActive="nc-controlPane-labelActive" controlComponent={widget.control} field={field} + uniqueFieldId={uniqueFieldId} value={value} mediaPaths={mediaPaths} metadata={metadata} diff --git a/src/components/Editor/EditorControlPane/Widget.js b/src/components/Editor/EditorControlPane/Widget.js index 8342b09c..9d7f5061 100644 --- a/src/components/Editor/EditorControlPane/Widget.js +++ b/src/components/Editor/EditorControlPane/Widget.js @@ -2,7 +2,6 @@ import PropTypes from 'prop-types'; import React, { Component } from 'react'; import ImmutablePropTypes from "react-immutable-proptypes"; import { Map } from 'immutable'; -import { uniqueId } from 'lodash'; import ValidationErrorTypes from 'Constants/validationErrorTypes'; const truthy = () => ({ error: false }); @@ -183,6 +182,7 @@ export default class Widget extends Component { setInactiveStyle, hasActiveStyle, editorControl, + uniqueFieldId } = this.props; return React.createElement(controlComponent, { field, @@ -195,7 +195,7 @@ export default class Widget extends Component { onAddAsset, onRemoveInsertedMedia, getAsset, - forID: uniqueId(field.get('name')), + forID: field.get('name') + uniqueFieldId, ref: this.processInnerControlRef, classNameWrapper, classNameWidget, diff --git a/yarn.lock b/yarn.lock index 362043bc..0d3b5ab1 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2352,20 +2352,13 @@ dns-txt@^2.0.2: dependencies: buffer-indexof "^1.0.0" -doctrine@1.3.x: +doctrine@1.3.x, doctrine@^1.2.2: version "1.3.0" resolved "https://registry.yarnpkg.com/doctrine/-/doctrine-1.3.0.tgz#13e75682b55518424276f7c173783456ef913d26" dependencies: esutils "^2.0.2" isarray "^1.0.0" -doctrine@^1.2.2: - version "1.5.0" - resolved "https://registry.yarnpkg.com/doctrine/-/doctrine-1.5.0.tgz#379dce730f6166f76cefa4e6707a159b02c5a6fa" - dependencies: - esutils "^2.0.2" - isarray "^1.0.0" - doctrine@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/doctrine/-/doctrine-2.0.0.tgz#c73d8d2909d22291e1a007a395804da8b665fe63" @@ -2419,20 +2412,13 @@ domhandler@^2.3.0: dependencies: domelementtype "1" -domutils@1.5.1: +domutils@1.5.1, domutils@^1.5.1: version "1.5.1" resolved "https://registry.yarnpkg.com/domutils/-/domutils-1.5.1.tgz#dcd8488a26f563d61079e48c9f7b7e32373682cf" dependencies: dom-serializer "0" domelementtype "1" -domutils@^1.5.1: - version "1.6.2" - resolved "https://registry.yarnpkg.com/domutils/-/domutils-1.6.2.tgz#1958cc0b4c9426e9ed367fb1c8e854891b0fa3ff" - dependencies: - dom-serializer "0" - domelementtype "1" - dot-prop@^4.1.0, dot-prop@^4.1.1: version "4.2.0" resolved "https://registry.yarnpkg.com/dot-prop/-/dot-prop-4.2.0.tgz#1f19e0c2e1aa0e32797c49799f2837ac6af69c57" @@ -5419,11 +5405,7 @@ miller-rabin@^4.0.0: bn.js "^4.0.0" brorand "^1.0.1" -"mime-db@>= 1.30.0 < 2": - version "1.31.0" - resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.31.0.tgz#a49cd8f3ebf3ed1a482b60561d9105ad40ca74cb" - -mime-db@~1.30.0: +"mime-db@>= 1.30.0 < 2", mime-db@~1.30.0: version "1.30.0" resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.30.0.tgz#74c643da2dd9d6a45399963465b26d5ca7d71f01" @@ -5461,7 +5443,7 @@ minimatch@3.0.3: dependencies: brace-expansion "^1.0.0" -minimist@0.0.8: +minimist@0.0.8, minimist@~0.0.1: version "0.0.8" resolved "https://registry.yarnpkg.com/minimist/-/minimist-0.0.8.tgz#857fcabfc3397d2625b8228262e86aa7a011b05d" @@ -5469,10 +5451,6 @@ minimist@^1.1.0, minimist@^1.1.1, minimist@^1.1.3, minimist@^1.2.0, minimist@~1. version "1.2.0" resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.0.tgz#a35008b20f41383eec1fb914f4cd5df79a264284" -minimist@~0.0.1: - version "0.0.10" - resolved "https://registry.yarnpkg.com/minimist/-/minimist-0.0.10.tgz#de3f98543dbf96082be48ad1a0c7cda836301dcf" - mississippi@^1.3.0: version "1.3.0" resolved "https://registry.yarnpkg.com/mississippi/-/mississippi-1.3.0.tgz#d201583eb12327e3c5c1642a404a9cacf94e34f5" @@ -7108,11 +7086,11 @@ pumpify@^1.3.3: inherits "^2.0.1" pump "^1.0.0" -punycode@1.3.2: +punycode@1.3.2, punycode@^1.2.4: version "1.3.2" resolved "https://registry.yarnpkg.com/punycode/-/punycode-1.3.2.tgz#9653a036fb7c1ee42342f2325cceefea3926c48d" -punycode@^1.2.4, punycode@^1.4.1: +punycode@^1.4.1: version "1.4.1" resolved "https://registry.yarnpkg.com/punycode/-/punycode-1.4.1.tgz#c0d5a63b2718800ad8e1eb0fa5269c84dd41845e" @@ -8413,11 +8391,7 @@ state-toggle@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/state-toggle/-/state-toggle-1.0.0.tgz#d20f9a616bb4f0c3b98b91922d25b640aa2bc425" -"statuses@>= 1.3.1 < 2": - version "1.4.0" - resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.4.0.tgz#bb73d446da2796106efcc1b601a253d6c46bd087" - -statuses@~1.3.1: +"statuses@>= 1.3.1 < 2", statuses@~1.3.1: version "1.3.1" resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.3.1.tgz#faf51b9eb74aaef3b3acf4ad5f61abf24cb7b93e"