2

I Am using multiselect dropdown, what i want is whatever i've selected in dropdown to send it to the server by calling an api which contains query param to accomodate these dropdown result. I have made an array of selected items. Array(3) [ "IphoneXR", "Nokia", "Samsung" ] I want this array to get pass to below url like this: http://localhost:8080/details?dropdown=IphoneXR,Nokia,Samsung. With my approach i am ending up with this: http://localhost:8080/details?dropdown[]=IphoneXR&dropdown[]=Nokia. I am not sure why dropdown[] is coming twice. Can anyone please help me with it

3
  • 1
    Hello! Please share the code snippet that is causing issue for the community to be able to contribute. Commented Jun 30, 2020 at 9:57
  • This will be helpful to you [stackoverflow.com/questions/1763508/… Commented Jun 30, 2020 at 10:01
  • thanks @JayParmar, link is very useful.it worked Commented Jun 30, 2020 at 10:18

2 Answers 2

3

Convert the array into string and pass the value in query param.

multiSelectHandler = (option) => {
    const details = option.selectedItems;
   const stringData =  details.map(({value}) => `${value}`).join(',');
   console.log(stringData);
  };

Array: Details: Output in console

0: Object { value: "Iphone", label: "Iphone" }
    ​1: Object { value: "Samsung", label: "Samsung"}

After converting into string:Output in console, Iphone,Samsung

Now pass this stringData in queryparam

Sign up to request clarification or add additional context in comments.

Comments

1

If you are passing it directly to a url via the form actions it will sent it in the url as this: index.html?cars=saab&cars=opel&cars=audi

Try handling the form via js like this How handle multiple select form in ReactJS

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.