ix icon indicating copy to clipboard operation
ix copied to clipboard

IX Select input clears if selection options change (since version 2.6.1)

Open alexis-delaunay opened this issue 10 months ago • 3 comments

Prerequisites

  • [x] I have read the Contributing Guidelines.
  • [x] I have not leaked any internal/restricted information like screenshots, videos, code snippets, links etc.

What happened?

Hi,

Use Case: We're using the iX-select to search and select data in a database. Every time the iX-select input changes, an API is being called to retrieve new data.

Problem: Since the Version 2.6.1 the input is getting cleared if a new value (select-option) is being added.

In the "How to Produce", you will also find our current workaround by adding an additional div-container around the selects.

What type of frontend framework are you seeing the problem on?

React

Which version of iX do you use?

2.6.1

Code to produce this issue.

// stackblitz: https://stackblitz.com/edit/react-ts-qcylb8l8?file=App.tsx
import * as React from 'react';
import './style.css';
import { IxSelect, IxSelectItem } from '@siemens/ix-react';

export default function App() {
  const [items, setItems] = React.useState<string[]>([]);

  const callApiWhichAddNewSelectOptions = (event: any) => {
    setTimeout(() => {
      setItems((prevItems) => [...prevItems, event.detail]);
    }, 1000);
  };

  return (
    <>
      <h3>broken select:</h3>
      <IxSelect
        value="1"
        onInputChange={callApiWhichAddNewSelectOptions}
        i18nPlaceholder="Search in database..."
      >
        {items.map((i, index) => (
          <IxSelectItem key={index} label={i} value={i}></IxSelectItem>
        ))}
      </IxSelect>
      <br />
      <br />
      <h3>working select (with additional container):</h3>
      <IxSelect
        value="1"
        onInputChange={callApiWhichAddNewSelectOptions}
        i18nPlaceholder="Search in database..."
      >
        <div>
          {items.map((i, index) => (
            <IxSelectItem key={index} label={i} value={i}></IxSelectItem>
          ))}
        </div>
      </IxSelect>
    </>
  );
}

alexis-delaunay avatar Feb 27 '25 19:02 alexis-delaunay

Could be introduced by #1574 or #1595, just to mention for further investigation.

danielleroux avatar Feb 28 '25 08:02 danielleroux

The issue has been labeled as Contribution welcome 👨‍💻. This issue is open for contributions from the community.

If you'd like to work on this issue, please comment here letting us know that you would like to submit a pull request for it. This helps us to keep track of the pull request and make sure there isn't duplicated effort. Thank you!

github-actions[bot] avatar Mar 03 '25 08:03 github-actions[bot]

🤖 Hello @vormacher

Your issue will be analyzed and is part of our internal workflow. To get informed about our workflow please checkout the Contributing Guidelines

JIRA: IX-2449

github-actions[bot] avatar Mar 10 '25 10:03 github-actions[bot]

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment!

github-actions[bot] avatar Jul 15 '25 07:07 github-actions[bot]

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please create a new issue with up-to-date information. Thank you!

github-actions[bot] avatar Jul 23 '25 11:07 github-actions[bot]