diff --git a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Select/select_Widget_Bug_spec.js b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Select/select_Widget_Bug_spec.js
index 042717f22f..1f1e614d97 100644
--- a/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Select/select_Widget_Bug_spec.js
+++ b/app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Widgets/Select/select_Widget_Bug_spec.js
@@ -234,4 +234,45 @@ describe("Select Widget Functionality", function() {
);
cy.goToEditFromPublish();
});
+ it("should check that filtering works well using numeric labels", () => {
+ cy.openPropertyPane("selectwidget");
+ cy.updateCodeInput(
+ ".t--property-control-options",
+ `[
+ {
+ "label": 1,
+ "value": "BLUE"
+ },
+ {
+ "label": 2,
+ "value": "GREEN"
+ },
+ {
+ "label": "3",
+ "value": "RED"
+ }
+ ]`,
+ );
+ cy.dragAndDropToCanvas("textwidget", { x: 300, y: 80 });
+ cy.openPropertyPane("textwidget");
+ cy.testJsontext("text", "{{typeof Select1.selectedOptionLabel}}");
+ // Filtering the option
+ cy.get(formWidgetsPage.selectWidget)
+ .find(widgetsPage.dropdownSingleSelect)
+ .click({
+ force: true,
+ });
+ cy.get(commonlocators.selectInputSearch).type("1");
+ // confirm it only has a single child
+ cy.get(".select-popover-wrapper .menu-virtual-list")
+ .children()
+ .should("have.length", 1);
+ cy.get(commonlocators.singleSelectWidgetMenuItem).contains("1");
+ cy.get(commonlocators.singleSelectWidgetMenuItem).click({
+ force: true,
+ });
+ cy.get(commonlocators.TextInside)
+ .first()
+ .should("have.text", "number");
+ });
});
diff --git a/app/client/src/widgets/JSONFormWidget/fields/SelectField.tsx b/app/client/src/widgets/JSONFormWidget/fields/SelectField.tsx
index 2a49117740..cc42ee3bfd 100644
--- a/app/client/src/widgets/JSONFormWidget/fields/SelectField.tsx
+++ b/app/client/src/widgets/JSONFormWidget/fields/SelectField.tsx
@@ -178,7 +178,7 @@ function SelectField({
placeholder={schemaItem.placeholderText}
selectedIndex={selectedIndex}
serverSideFiltering={schemaItem.serverSideFiltering}
- value={options[selectedOptionIndex]?.value}
+ value={options[selectedOptionIndex]?.value?.toString()}
widgetId={fieldClassName}
width={10}
/>
diff --git a/app/client/src/widgets/SelectWidget/component/index.tsx b/app/client/src/widgets/SelectWidget/component/index.tsx
index dbd71c5b5e..664b51b7ea 100644
--- a/app/client/src/widgets/SelectWidget/component/index.tsx
+++ b/app/client/src/widgets/SelectWidget/component/index.tsx
@@ -94,7 +94,10 @@ class SelectComponent extends React.Component<
const filter = items.filter(
(item) =>
- item.label?.toLowerCase().includes(query.toLowerCase()) ||
+ item.label
+ ?.toString()
+ .toLowerCase()
+ .includes(query.toLowerCase()) ||
String(item.value)
.toLowerCase()
.includes(query.toLowerCase()),
@@ -296,7 +299,7 @@ class SelectComponent extends React.Component<
this.spanRef.current.parentElement.scrollHeight ||
this.spanRef.current.parentElement.offsetWidth <
this.spanRef.current.parentElement.scrollWidth)
- ? value
+ ? value.toString()
: "";
return (
@@ -387,13 +390,13 @@ class SelectComponent extends React.Component<
>
@@ -426,8 +429,8 @@ export interface SelectComponentProps extends ComponentProps {
serverSideFiltering: boolean;
hasError?: boolean;
onFilterChange: (text: string) => void;
- value?: string;
- label?: string;
+ value?: string | number;
+ label?: string | number;
filterText?: string;
borderRadius: string;
boxShadow?: string;
diff --git a/app/client/src/widgets/SelectWidget/constants.ts b/app/client/src/widgets/SelectWidget/constants.ts
index cb469ed7e8..0486b4d2fe 100644
--- a/app/client/src/widgets/SelectWidget/constants.ts
+++ b/app/client/src/widgets/SelectWidget/constants.ts
@@ -1,10 +1,9 @@
import { Intent as BlueprintIntent } from "@blueprintjs/core";
import { IconName } from "@blueprintjs/icons";
-export type SelectionType = "SINGLE_SELECT" | "MULTI_SELECT";
export interface DropdownOption {
- label?: string;
- value?: string;
+ label?: string | number;
+ value?: string | number;
icon?: IconName;
subText?: string;
id?: string;
diff --git a/app/client/src/widgets/TableWidgetV2/component/cellComponents/SelectCell.tsx b/app/client/src/widgets/TableWidgetV2/component/cellComponents/SelectCell.tsx
index 84d5a198ed..fae9b8202a 100644
--- a/app/client/src/widgets/TableWidgetV2/component/cellComponents/SelectCell.tsx
+++ b/app/client/src/widgets/TableWidgetV2/component/cellComponents/SelectCell.tsx
@@ -54,7 +54,7 @@ type SelectProps = {
action?: string,
) => void;
onItemSelect: (
- value: string,
+ value: string | number,
rowIndex: number,
column: string,
action?: string,
diff --git a/app/client/src/widgets/TableWidgetV2/widget/index.tsx b/app/client/src/widgets/TableWidgetV2/widget/index.tsx
index fbcb41fe87..79ea45c46b 100644
--- a/app/client/src/widgets/TableWidgetV2/widget/index.tsx
+++ b/app/client/src/widgets/TableWidgetV2/widget/index.tsx
@@ -1841,7 +1841,7 @@ class TableWidgetV2 extends BaseWidget {
};
onOptionSelect = (
- value: string,
+ value: string | number,
rowIndex: number,
column: string,
action?: string,