reactjs - i want to make menu dropdown react js django in section (salary)

Question

I'm trying to menu dropdow reactjs django in the section formgroup (salary): and this is the source code from [github] https://github.com/diogosouza/django-react-logrocket

import React from "react";
import Select from 'react-select';
import { Button, Form, FormGroup, Input, Label } from "reactstrap";

import axios from "axios";

import { API_URL } from "../constants";

class NewStudentForm extends React.Component {
  state = {
    pk: 0,
    name: "",
    address: "",
    role: "",
    department: "",
    salary: ""
  };

  componentDidMount() {
    if (this.props.student) {
      const { pk, name, address, role, department, salary } = this.props.student;
      this.setState({ pk, name, address, role, department, salary });
    }
  }

  onChange = e => {
    this.setState({ [e.target.name]: e.target.value });
  };

  createStudent = e => {
    e.preventDefault();
    axios.post(API_URL, this.state).then(() => {
      this.props.resetState();
      this.props.toggle();
    });
  };

  editStudent = e => {
    e.preventDefault();
    axios.put(API_URL + this.state.pk, this.state).then(() => {
      this.props.resetState();
      this.props.toggle();
    });
  };

  defaultIfEmpty = value => {
    return value === "" ? "" : value;
  };

all forms in the code:

render() {
    return (
      <Form onSubmit={this.props.student ? this.editStudent : this.createStudent}>
        <FormGroup>
          <Label for="name">Name:</Label>
          <Input
            type="text"
            name="name"
            onChange={this.onChange}
            value={this.defaultIfEmpty(this.state.name)}
          />
        </FormGroup>
        <FormGroup>
          <Label for="address">Address:</Label>
          <Input
            type="address"
            name="address"
            onChange={this.onChange}
            value={this.defaultIfEmpty(this.state.address)}
          />
        </FormGroup>
        <FormGroup>
          <Label for="role">Role:</Label>
          <Input
            type="text"
            name="role"
            onChange={this.onChange}
            value={this.defaultIfEmpty(this.state.role)}
          />
        </FormGroup>
        <FormGroup>
          <Label for="department">Department:</Label>
          <Input
            type="text"
            name="department"
            onChange={this.onChange}
            value={this.defaultIfEmpty(this.state.department)}
          />
          </FormGroup>
        <FormGroup>
          <Label for="salary">Salary:</Label>
          <Input
            type="text"
            name="salary"
            onChange={this.onChange}
            value={this.defaultIfEmpty(this.state.salary)}
          />
        </FormGroup>
        <Button>Send</Button>
      </Form>
    );
  }
}

export default NewStudentForm;

And finally here where i want to put it in salary formgroup:

 <FormGroup>
          <Label for="salary">Salary:</Label>
          <Input
            type="text"
            name="salary"
            onChange={this.onChange}
            value={this.defaultIfEmpty(this.state.salary)}
          />
        </FormGroup>

I cannot fin any tutorial in youtube for reactjs and django:

question from:https://stackoverflow.com/questions/66056972/i-want-to-make-menu-dropdown-react-js-django-in-section-salary

Answer 1

Waitting for answers