I have a form in my application. I also have a view component that creates an input field using vue-google-maps.
I use this component within my but there is no name attribute so my server does not recognize a submitted value.
How can I submit the data from the input field to my server? I am using Laravel 5.3.
<template>
<place-input
:place.sync="placeInput.place"
:types.sync="placeInput.types"
:component-restrictions.sync="placeInput.restrictions"
class='form-control'
label='Location: '
name='location'
></place-input>
<pre>{{ placeInput.place | json }}</pre>
</template>
<script>
import { PlaceInput, Map } from 'vue-google-maps'
export default {
data() {
return {
placeInput: {
place: {
name: ''
},
types: [],
restrictions: {'country': 'usa'}
}
}
},
components: {
PlaceInput
},
ready() {
}
}
</script>
<style>
label { display: block; }
</style>
My Laravel form looks like this:
{!! Form::open(['action' => 'CandidateController@store']) !!}
<div class='form-group'>
{!! Form::label('email', 'Email:') !!}
{!! Form::email('email', null, ['class' => 'form-control']) !!}
</div>
<div class='form-group'>
{!! Form::label('phone', 'Phone:') !!}
{!! Form::text('phone', null, ['class' => 'form-control']) !!}
</div>
<div class='form-group'>
<location-input></location-input>
</div>
{!! Form::close() !!}
Where location-input is the vue-google-maps component that generates an input.
When I submit the form and dump the data to the screen no location data is available!
on server
$input = Request::all();
dd($input);
The raw input looks like this (the name attribute on the component does not add to the input field):
How do I submit the location-input data along with my form?
