How to pass dropdown values into mongodb in react?

I'm new to react. I create a form which consist with input fields, button and drop-down menu. It's is a functional component. I need to pass selected drop-down items' id to back-end through axios with other form value. Before create drop-down other values that get from input fields could add pass to backend. Is there any way to pass values to back-end with other form input values? Here is my code.

const [course, setCourse] = useState({
    name: "",
    code: "",
    passMark: "",
    lic: "",
    subjects: [],
    options: []
});

//const [subject, setSubject] = useState();

async function getSubjects(){
    const res = await axios.get("http://localhost:3000/subject")
    const data = res.data
    const option = data.map((item)=>({
        "value" : item._id,
        "label" : item.name
    }))

    setCourse({options: option})
}

/*function handleSelect(event){
    setSubject(event.target.value)
}*/

function handleClick(){
    axios.post("http://localhost:3000/course/add",course).then((res)=>{
        console.log(res);
    }).catch((err)=>{
        console.log(err);
    })
}

return (
                <Form.Group className="mb-3" >
                    <Form.Label>Subjects</Form.Label>
                    <Select options={course.options} name="subjects" isMulti  />
                </Form.Group>

                <Button variant="primary" type="submit" onClick={handleClick}>
                    Submit
                </Button>
            </Form>
        </div>
    </div>
)

export default CreateStudent;


Read more here: https://stackoverflow.com/questions/67933292/how-to-pass-dropdown-values-into-mongodb-in-react

Content Attribution

This content was originally published by racketman at Recent Questions - Stack Overflow, and is syndicated here via their RSS feed. You can read the original post over there.

%d bloggers like this: