React JS & Axios : How to post array of objects with axios form data

user_18088282 0
Viewed 73

I have an endpoint that accept array of objects, but I don't know how to post the data based on user input using onChange. Here's my code

const [valuesInput, setValuesInput] = useState({
    title: "",
    question: [{ text: "", values: "" }],
    category: "",
  }); 

const data = new FormData();
data.append("feedback_title", valuesInput.title);
data.append("feedback_question", valuesInput.question);
data.append("kategori_feedback_id", valuesInput.category);

 <input key={c} type="text" onChange={(e) => {setValuesInput({...valuesInput,question: [
{text: e.target.value,values: e.target.value,},],});}} />

the things that I want to achieve are like this code :

"data": [
        {
            "pertanyaan_feedback_id": 1,
            "kategori_feedback_id": null,
            "feedback_title": "test",
            "feedback_question": [
                {
                    "values": "dsfdsf",
                    "text": "vvfddf"
                },
                {
                    "values": "dsfdsf",
                    "text": "vvfddf"
                },
                {
                    "values": "dsfdsf",
                    "text": "vvfddf"
                },
                {
                    "values": "dsfdsf",
                    "text": "vvfddf"
                }
            ],
            "created_at": "2022-07-24T04:56:06.000000Z",
            "updated_at": "2022-07-24T04:56:06.000000Z"
        }

are there any suggestion what should I do to post array of object based on my code above? I'm very thankful if you want to give soe advice to solve my problem..

axios reactjs
1 Answers

I think when you feedback a product, you post with NewFeedback function include 2 or 3 fields pertanyaan_feedback_id and feedback_title or kategori_feedback_id if you need. After that, If have new a question, you go on post with NewQuestion function include 2 fields text and values

When getAll you have data such as expect

The last data have a id for feedback_question and data, that is very easy when update or delete.

"data": [
        {
            "id": 1,                      // Add id
            "pertanyaan_feedback_id": 1,
            "kategori_feedback_id": null,
            "feedback_title": "test",
            "feedback_question": [
                {
                    "id": 1,              // Add id
                    "values": "dsfdsf",
                    "text": "vvfddf"
                },
                {
                    "id": 2,              // Add id
                    "values": "dsfdsf",
                    "text": "vvfddf"
                },
                {
                    "id": 3,              // Add id
                    "values": "dsfdsf",
                    "text": "vvfddf"
                },
                {
                    "id": 4,              // Add id
                    "values": "dsfdsf",
                    "text": "vvfddf"
                }
            ],
            "created_at": "2022-07-24T04:56:06.000000Z",
            "updated_at": "2022-07-24T04:56:06.000000Z"
        }
user_155274150
Related