question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

cannot set value as a string instead of object in multiple selection

See original GitHub issue

In single selection the below code works for only sending the value as string but in multiple it does not work.

Here is the code

const SearchableTextField = ({
  children,
  input,
  options,
  isMulti,
  valueType,
  ...props
}) => {
  return (
    <label className={props.className}>
      {children}
      <Select
        {...props}
        clearable={props.clearable}
        searchable={props.searchable}
        options={options}
        {...input}
        value={options.find(option =>
          valueType === 'string'
            ? option.value === input.value
            : option === input.value
        )}
        onChange={option =>
          valueType === 'string'
            ? input.onChange(option.value)
            : input.onChange(option)
        }
        onBlur={() => input.onBlur(input.value)}
        styles={props.styles}
        components={{
          DropdownIndicator: props.selectIcon || DropdownComponent
        }}
        styles={SelectStyleSetting}
        isMulti={isMulti}
      />
    </label>
  );
};

If i have the options as following

options = [
 {value: 'abc', label: 'ABC'},
 {value: 'abc2', label: 'ABC2'},
]

the expected output when i select suppose first option is selectedOption: “abc” in single selection which works and in multiple it should be selectedOption: [“abc”, “abc2”] (this is not working)

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:1
  • Comments:5

github_iconTop GitHub Comments

1reaction
ebonowcommented, Oct 12, 2021

My opinion is that this thread should be closed.

Since version 2, the expected type of a prop passed in as a value can be:

  1. an object representing an option
  2. an array of objects (representing an option)
  3. null
  4. undefined

string was a supported in v1 when simpleValue was enabled, but this is no longer the expected behavior.

@0xorial please let me know if I am misunderstanding, but your type error seems to indicate that you are trying to set the value of the select as the value of the selected option(s) instead of the options themselves.

0reactions
Methuselah96commented, Oct 10, 2021

@0xorial Can you provide a CodeSandbox with an example of what you’re trying to do?

Read more comments on GitHub >

github_iconTop Results From Across the Web

cannot set value as a string instead of object in multiple ...
The problem is here onChange={option => valueType === "string" ? input.onChange(option.value) : input.onChange(option) }.
Read more >
Object variable or With block variable not set - Visual Basic
For example, an array declared as products() As String will trigger the error if you try to reference an element of the array...
Read more >
Cannot select multiple objects in AutoCAD
To enable multiple selections by clicking them with the mouse: On the command line in AutoCAD, enter the PICKADD command. Enter 2 for...
Read more >
Array - JavaScript - MDN Web Docs
Array objects cannot use arbitrary strings as element indexes (as in ... will set or access a variable associated with that array's object...
Read more >
Angular ng-select - npm
Angular ng-select - All in One UI Select, Multiselect and ... bindValue, string, -, no, Object property to use for selected model.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found