Question

我在此表单中有两个输入，选项（多选）和金额

我设法将金额添加到新表格，但是我无法添加所选的选项。

HTML

SELECT FOLIO_NUMBER, TERMINAL_NAME, ORDER_ENTRY_TIME, START_LOAD_TIME, END_LOAD_TIME,
       datediff(mi, ORDER_ENTRY_TIME, START_LOAD_TIME) AS STAGING_MINUTES,
       datediff(mi, START_LOAD_TIME, END_LOAD_TIME) AS LOADING_MINUTES,
       datediff(mi, ORDER_ENTRY_TIME, END_LOAD_TIME) AS TERMINAL_MINUTES   
FROM ORDERS  
JOIN TERMINAL_OWNER ON ORDERS.LOADING_TERMINAL_ID = TERMINAL_OWNER.TERMINAL_ID
WHERE TERMINAL_ID = '1913' AND FOLIO_NUMBER >= '20190101' AND FOLIO_NUMBER <= '20190201'
ORDER BY FOLIO_NUMBER ASC

JS

 <template>
    <div class="container">
        <form @submit.prevent="submitForm" @keydown="form.onKeydown($event)">
            <h5 class="form-header">
                Vue JS form - Laravel
            </h5>
            <div class="form-group row">
                <label class="col-form-label col-sm-4" for=""> Options</label>
                <div class="col-sm-8">
                    <multiselect
                        v-model="selected"
                        :options="options">
                    </multiselect>
                </div>
            </div>
            <div class="form-group row">
                <label class="col-form-label col-sm-4" for=""> amount</label>
                <div class="col-sm-8">
                <input v-model="form.amount" type="text" name="amount" class="form-control" >
                </div>
            </div>
            <div class="form-buttons-w text-right">
                <button class="btn btn-primary" type="submit">Save</button>
            </div>
        </form>
    </div>
  </template>

如何在提交的数据中获取选定的选项（ multiselect ）？以同样的方式获取金额。

Answer 1

您可以这样做

 <div class="form-group row">
     <label class="col-form-label col-sm-4" for=""> Options</label>
         <div class="col-sm-8">
              <multiselect
               v-model="form.selected"
               :options="options">
              </multiselect>
         </div>
 </div>
<script>
export default {
  data(){
    return {
      selected: null,
      options: ['One', 'Two', 'Three'],
      form: new Form({
        amount : '',
        selected:[],
      })
    }
  },
  methods : {
    submitForm(){
      this.form.post('api/transaction')
    }
  },
  mounted() {

  }
}    </script>

如何提交“ vue-multiselect”选择的选项-Vue.js

1 个答案: