React formik and select array to string Convert onSubmit

Question

React formik and react select package are I am using . I created on form that contains user can create new and Edit also working in same form. I have an one multi select field that field values are in array I want to change to string send to server on onSubmit. And also on update I want to get the string value convert array set to select field. I try it but cant found solution .please give me any ideas It helpful for me codeSandbox:https://codesandbox.io/s/multipleselect-formik-3eqxp?file=/src/RegisterForm.js Thanks for help

Answer 1

After getting the field value change the array to string on before submit. we want bind the change string value on field. It will be working fine for me.

Code Sandbox link :https://codesandbox.io/s/multipleselect-formik-3eqxp?file=/src/RegisterForm.js:657-844

 function create(fields) {
    console.log(fields);
    const jobs = [];
    fields.job.map((ele) => jobs.push(ele.value));
    fields.job = jobs.toString();
    console.log(fields);
  }

Answer 2

i am not sure if this what you are looking for, but i did

     function create(fields) {
    fields.job = JSON.stringify(fields.job)
    console.log(fields);
  }

or

  function create(fields) {
    const jobs = [];
    fields.job= fields.job.map((ele) => jobs.push(ele.value));
    console.log(fields);
  }

instead of

  function create(fields) {
    console.log(fields);
    const jobs = [];
    fields.job.map((ele) => jobs.push(ele.value));
    const job = ("text => ", jobs.toString());
    console.log(job);
    console.log(fields);
  }

Answer 3

I think you want to get the value from the array where the result should be

{name: "111", fatherName: "222", job: ["enginner", "painter"] }

function create(fields) { 
    const amendedFields = {
      ...fields,
      job: fields.job.map((ele) => ele.value) // extract value from object,  ["enginner", "painter"]
    }; // not mutating the current fields object, copy it and mutate the new one.
    console.log("old", fields);
    console.log("new", amendedFields);
}