Hi, i am trying to submit data to my laravel backend using axios. I need to be able to capture the id of the client that the engagement will be linked to and im struggling to understand how i can access that information so i can send it with the post request.

this is the form component

 <form @submit.prevent="addEngagement" class="d-flex-column justify-content-center">
          <div class="form-group">
            <input type="text" class="form-control mb-3" placeholder="Client" v-model="engagement.client_id">
            <select class="form-control mb-3" id="type" v-model="engagement.return_type">
              <option v-for="type in types" :key="type.id" :value="type">{{ type }}</option>
            </select>
            <input type="text" class="form-control mb-3" placeholder="Year" v-model="engagement.year">
            <input type="text" class="form-control mb-3" placeholder="Assign To" v-model="engagement.assigned_to">
            <input type="text" class="form-control mb-3" placeholder="Status" v-model="engagement.status">

            <button type="submit" class="btn btn-lg btn-primary d-flex justify-content-start">Create</button>
          </div>
        </form>

this is the form component data

engagement: {
        client_id: '',
        return_type: null,
        year: '',
        assigned_to: '',
        status: '',
      },

this is the form component method

 methods: {
    addEngagement(e) {
      if(!this.engagement.client_id || !this.engagement.return_type || !this.engagement.year ){
        return
      } else {
        this.$store.dispatch('addEngagement', {
          id: this.idForEngagement,
          client_id: this.engagement.client_id,
          return_type: this.engagement.return_type,
          year: this.engagement.year,
          assigned_to: this.engagement.assigned_to,
          status: this.engagement.status,
        })
        e.preventDefault();
      }
      e.preventDefault();
      this.engagement = "" 
      this.idForEngagement++
      this.$router.push('/engagements')
    },
  },

Now when i capture the data from here it dispatches my store for the method addEngagement below

addEngagement(context, engagement) {
      axios.post('http://traxit.test/api/engagements', {
        id: engagement.id,
        client_id: engagement.client_id,
        return_type: engagement.return_type,
        year: engagement.year,
        assigned_to: engagement.assigned_to,
        status: engagement.status,
        done: false
      })
      .then(response => {
        context.commit('getClientEngagement', response.data)
      })
      .catch(error => {
        console.log(error)
      })

and sends it the laravel backend to my api route here

Route::post('/engagements', '[email protected]');

From here it would be process by the EngagementsController...

So currently i have the the client_id as a basic input but Im wondering if there is away to capture the id of the client i am trying to create the engagement for because in laravel the engagement will have belongsTo() relationship with the client.

The client id is supposed to be referencing my client table and i dont know how to capture that data without having to manually put it in each time before submitting

this is the controller handling the form post

public function store(Request $request)
    {
        $data = $request->validate([
            'client_id' => 'required|integer',
            'return_type' => 'required|string',
            'year' => 'required|string',
            'status' => 'required|string',
            'assigned_to' => 'required|string',
            'done' => 'required|boolean'
        ]);

        $engagement = Engagement::create([
            'client_id' => $request->client_id,
            'return_type' => $request->return_type,
            'year' => $request->year,
            'status' => $request->status,
            'assigned_to' => $request->assigned_to,
            'done' => $request->done,
        ]);

        return response($engagement, 201);
    }

Hopefully I am being detailed enough on what my issue is. Please as for my more clarity if needed!!