diff --git a/src/controls/dynamicForm/DynamicForm.tsx b/src/controls/dynamicForm/DynamicForm.tsx index 3d3de473e..e40544bb2 100644 --- a/src/controls/dynamicForm/DynamicForm.tsx +++ b/src/controls/dynamicForm/DynamicForm.tsx @@ -470,7 +470,7 @@ export class DynamicFormBase extends React.Component< // Choice fields if (fieldType === "Choice") { - objects[fieldcolumnInternalName] = field.newValue.key; + objects[fieldcolumnInternalName] = field.newValue?field.newValue.key:null } if (fieldType === "MultiChoice") { objects[fieldcolumnInternalName] = { results: field.newValue }; @@ -781,7 +781,7 @@ export class DynamicFormBase extends React.Component< // Store string values for various field types if (field.fieldType === "Choice") { - field.stringValue = newValue.text; + field.stringValue = newValue? newValue.text:''; } if (field.fieldType === "MultiChoice") { field.stringValue = newValue.join(';#'); diff --git a/src/controls/dynamicForm/dynamicField/DropdownWithRemoveButton.tsx b/src/controls/dynamicForm/dynamicField/DropdownWithRemoveButton.tsx new file mode 100644 index 000000000..0deac82e5 --- /dev/null +++ b/src/controls/dynamicForm/dynamicField/DropdownWithRemoveButton.tsx @@ -0,0 +1,39 @@ +import { Dropdown, IconButton, IDropdownProps, IIconProps } from "@fluentui/react"; +import React from "react"; +import { useState } from "react"; + + + +export const DropdownWithRemoveButton = (props: IDropdownProps): JSX.Element => { + const [isEditing, setIsEditing] = useState(false); + + const titleRendererWithRemoveButton: IDropdownProps["onRenderTitle"] = (options) => { + const iconStyles = { + root: { "font-size": '12px' } + }; + const removeIcon: IIconProps = { iconName: 'Clear', styles: iconStyles }; + return ( +