Vue-Select: получение значения объекта на странице через метод POST

Это мой воспроизведенный код.

Vue.component('v-select', VueSelect.VueSelect); var app = new Vue({ el: '#app', data: { lokasi_select: '', lokasi_id: '', lokasi_list: [{ id_Location: 'LOC0001', nama_Location: 'Indonesia' }, { id_Location: 'LOC0002', nama_Location: 'China' }, { id_Location: 'LOC0003', nama_Location: 'America' }, ], } });

 <div id='app' class="form-group my-5 mx-5"> <form method='post' action='action.php'> <label for="lokasi_id" class="control-label required"> <strong>Lokasi</strong></label> <v-select id='lokasi_id' label='nama_Location' v-model='lokasi_select' name="lokasi_select" :options="lokasi_list" placeholder='Ketik lokasi..'> <span slot="no-options">Lokasi tidak ditemukan.</span> </v-select> <p>What you selected: {{lokasi_select}}</p> <button>Submit</button> </form> </div> <script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/vue-select/2.5.1/vue-select.js"></script>

php html5 forms vuejs2 vue-select

Всего 1 ответ

Обращаясь к этой проблеме , я думаю, вам нужно добавить hidden входы, как показано ниже.
Я подтвердил, что PHP может получать значения post этим кодом.

<div id='app' class="form-group my-5 mx-5">
  <form method='post' action='action.php'>
    <label for="lokasi_id" class="control-label required">
    <strong>Lokasi</strong></label>
    <v-select id='lokasi_id' label='nama_Location' v-model='lokasi_select' name="lokasi_select" :options="lokasi_list" placeholder='Ketik lokasi..'>
      <span slot="no-options">Lokasi tidak ditemukan.</span>
    </v-select>
    <input type="hidden" v-model="lokasi_select.id_Location" name="id_Location" />
    <input type="hidden" v-model="lokasi_select.nama_Location" name="nama_Location" />

    <p>What you selected: {{lokasi_select}}</p>
    <button>Submit</button>
  </form>
</div>

<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue-select/2.5.1/vue-select.js"></script>

<?php
    // Returns like
    // "array(2) { ["id_Location"]=> string(7) "LOC0001" ["nama_Location"]=> string(9) "Indonesia" }"
    var_dump($_POST);
?>