Skip to content

Commit b26064e

Browse files
anna-shakhovaanna-shakhova
authored
Form: fix get item by path (T1311534) (#31545)
1 parent e2cce8d commit b26064e

File tree

3 files changed

+135
-20
lines changed

3 files changed

+135
-20
lines changed

‎packages/devextreme/js/__internal/ui/form/m_form.ts‎

Lines changed: 11 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1160,21 +1160,11 @@ class Form extends Widget<FormProperties> {
11601160
fieldName: string;
11611161
fieldPath: string[];
11621162
} {
1163-
const fieldSeparator = '.';
1164-
let fieldName = field;
1165-
let separatorIndex = fieldName.indexOf(fieldSeparator);
1166-
const resultPath = [];
1167-
1168-
while (separatorIndex !== -1) {
1169-
// @ts-expect-error ts-error
1170-
resultPath.push(fieldName.substr(0, separatorIndex));
1171-
fieldName = fieldName.substr(separatorIndex + 1);
1172-
separatorIndex = fieldName.indexOf(fieldSeparator);
1173-
}
1163+
const [fieldName, ...fieldPath] = field.split('.').reverse();
11741164

11751165
return {
11761166
fieldName,
1177-
fieldPath: resultPath.reverse(),
1167+
fieldPath,
11781168
};
11791169
}
11801170

@@ -1198,17 +1188,22 @@ class Form extends Widget<FormProperties> {
11981188
pathNode = path.pop();
11991189
}
12001190

1201-
if (!path.length) {
1191+
if (!path.length && nameWithoutSpaces === pathNode) {
12021192
result = that._getItemByField(fieldName, item[subItemsField]);
12031193

12041194
if (result) {
12051195
break;
12061196
}
12071197
}
12081198

1209-
if (!isGroupWithName || isGroupWithName && nameWithoutSpaces === pathNode) {
1210-
if (path.length) {
1211-
result = that._searchItemInEverySubItem(path, fieldName, item[subItemsField]);
1199+
const isGroupPathNodeOrUnnamed = !isGroupWithName
1200+
|| (isGroupWithName && nameWithoutSpaces === pathNode);
1201+
1202+
if (isGroupPathNodeOrUnnamed && path.length) {
1203+
result = that._searchItemInEverySubItem(path, fieldName, item[subItemsField]);
1204+
1205+
if (!result) {
1206+
break;
12121207
}
12131208
}
12141209
} else {

‎packages/devextreme/testing/tests/DevExpress.ui.widgets.form/form.API.update_items_dynamically.tests.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2056,19 +2056,19 @@ module('Align labels', () => {
20562056
}]
20572057
});
20582058

2059-
testWrapper.setItemOption('title1.group1.description', 'visible', false);
2059+
testWrapper.setItemOption('title1.group2.description', 'visible', false);
20602060
testWrapper.checkLabelsWidthInGroup({ columnIndex: 0, groupColumnIndex: 0, etalonLabelText: 'Home Address' });
20612061
testWrapper.checkLabelsWidthInGroup({ columnIndex: 0, groupColumnIndex: 1, etalonLabelText: 'Last Name' });
20622062

2063-
testWrapper.setItemOption('title1.group1.homeAddress', 'visible', false);
2063+
testWrapper.setItemOption('title1.group2.homeAddress', 'visible', false);
20642064
testWrapper.checkLabelsWidthInGroup({ columnIndex: 0, groupColumnIndex: 0, etalonLabelText: 'Name' });
20652065
testWrapper.checkLabelsWidthInGroup({ columnIndex: 0, groupColumnIndex: 1, etalonLabelText: 'Last Name' });
20662066

2067-
testWrapper.setItemOption('title1.group1.description', 'visible', true);
2067+
testWrapper.setItemOption('title1.group2.description', 'visible', true);
20682068
testWrapper.checkLabelsWidthInGroup({ columnIndex: 0, groupColumnIndex: 0, etalonLabelText: 'Description' });
20692069
testWrapper.checkLabelsWidthInGroup({ columnIndex: 0, groupColumnIndex: 1, etalonLabelText: 'Last Name' });
20702070

2071-
testWrapper.setItemOption('title1.group1.homeAddress', 'visible', true);
2071+
testWrapper.setItemOption('title1.group2.homeAddress', 'visible', true);
20722072
testWrapper.checkLabelsWidthInGroup({ columnIndex: 0, groupColumnIndex: 0, etalonLabelText: 'Description' });
20732073
testWrapper.checkLabelsWidthInGroup({ columnIndex: 0, groupColumnIndex: 1, etalonLabelText: 'Home Address' });
20742074
});

‎packages/devextreme/testing/tests/DevExpress.ui.widgets.form/form.tests.js‎

Lines changed: 120 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2427,6 +2427,126 @@ QUnit.test('Use \'itemOption\' with groups and one group has empty caption (T359
24272427
assert.equal($testContainer.find('.' + FORM_GROUP_CAPTION_CLASS).last().text(), 'custom', 'new caption rendered');
24282428
});
24292429

2430+
QUnit.test('Use \'itemOption\' with path when items have same name or caption (T1311534)', function(assert) {
2431+
const targetField = {
2432+
itemType: 'simple',
2433+
name: 'Target',
2434+
editorType: 'dxTextBox',
2435+
};
2436+
2437+
const targetGroup = {
2438+
itemType: 'group',
2439+
caption: 'Target',
2440+
items: [
2441+
{ itemType: 'simple', name: 'Field1', editorType: 'dxTextBox', },
2442+
{ itemType: 'simple', name: 'Field2', editorType: 'dxTextBox', },
2443+
{ itemType: 'simple', name: 'Field3', editorType: 'dxTextBox', },
2444+
],
2445+
};
2446+
2447+
const targetFieldInGroup = {
2448+
...targetField,
2449+
caption: 'Target in Group'
2450+
};
2451+
2452+
const form = $('#form').dxForm({
2453+
formData: {},
2454+
items: [
2455+
{
2456+
itemType: 'group',
2457+
name: 'ContainerGroup',
2458+
items: [
2459+
{ itemType: 'simple', name: 'Field4', editorType: 'dxTextBox', },
2460+
targetGroup,
2461+
]
2462+
},
2463+
{
2464+
itemType: 'group',
2465+
name: 'FieldGroup',
2466+
items: [
2467+
targetFieldInGroup,
2468+
{ itemType: 'simple', name: 'Field5', editorType: 'dxTextBox', },
2469+
],
2470+
},
2471+
targetField,
2472+
]
2473+
}).dxForm('instance');
2474+
2475+
assert.deepEqual(form.itemOption('Target'), targetField, 'Simple item retrieved by name');
2476+
assert.deepEqual(form.itemOption('ContainerGroup.Target'), targetGroup, 'Group item in group retrieved by path');
2477+
assert.deepEqual(form.itemOption('FieldGroup.Target'), targetFieldInGroup, 'Simple item in group retrieved by path');
2478+
});
2479+
2480+
QUnit.test('Use \'itemOption\' with path when items have same name in named and unnamed groups (T1311534)', function(assert) {
2481+
const targetField = {
2482+
itemType: 'simple',
2483+
name: 'Target',
2484+
editorType: 'dxTextBox',
2485+
};
2486+
2487+
const targetFieldInGroup = {
2488+
...targetField,
2489+
caption: 'Target in Group'
2490+
};
2491+
2492+
const form = $('#form').dxForm({
2493+
formData: {},
2494+
items: [
2495+
{
2496+
itemType: 'group',
2497+
name: 'FieldGroup',
2498+
items: [
2499+
targetFieldInGroup,
2500+
{ itemType: 'simple', name: 'Field5', editorType: 'dxTextBox', },
2501+
],
2502+
},
2503+
{
2504+
itemType: 'group',
2505+
items: [
2506+
{ itemType: 'simple', name: 'Field4', editorType: 'dxTextBox', },
2507+
targetField,
2508+
]
2509+
},
2510+
]
2511+
}).dxForm('instance');
2512+
2513+
assert.deepEqual(form.itemOption('Target'), targetField, 'Simple item in unnamed group retrieved by name');
2514+
assert.deepEqual(form.itemOption('FieldGroup.Target'), targetFieldInGroup, 'Simple item in group retrieved by path');
2515+
});
2516+
2517+
QUnit.test('Use \'itemOption\' with path in nested groups (T1311534)', function(assert) {
2518+
const targetField = {
2519+
itemType: 'simple',
2520+
name: 'Target',
2521+
editorType: 'dxTextBox',
2522+
};
2523+
2524+
const targetFieldInGroup = {
2525+
...targetField,
2526+
caption: 'Target in Group'
2527+
};
2528+
2529+
const form = $('#form').dxForm({
2530+
formData: {},
2531+
items: [{
2532+
itemType: 'group',
2533+
items: [
2534+
{
2535+
itemType: 'group',
2536+
name: 'FieldGroup',
2537+
items: [
2538+
targetFieldInGroup,
2539+
{ itemType: 'simple', name: 'Field5', editorType: 'dxTextBox', },
2540+
],
2541+
},
2542+
{ itemType: 'simple', name: 'Field4', editorType: 'dxTextBox', },
2543+
]
2544+
}]
2545+
}).dxForm('instance');
2546+
2547+
assert.deepEqual(form.itemOption('FieldGroup.Target'), targetFieldInGroup, 'Simple item in group retrieved by path');
2548+
});
2549+
24302550
QUnit.test('Use \'itemOption\' with tabs', function(assert) {
24312551
const $testContainer = $('#form').dxForm({
24322552
formData: { EmployeeID: 1, LastName: 'John', FirstName: 'Dow', BirthData: '01/01/1970', HireDate: '12/11/1995', Country: 'USA', City: 'Phoenix', Region: 'Arizona', Title: 'Ms' },

0 commit comments

Comments
 (0)