如何填充输入选择框Laravel Vue JS

时间:2020-06-08 06:28:08

标签: vue.js

我在项目上使用Vue进行表单输入,但是在我的输入1字段中,选择框无法记录在我的发送输入中(始终为null),另一个文件如tipe文本,对其工作进行了编号,但只有此选择框无法记录在输入

输入我的信息

    // this field select cant record ( always give null ) , 

           <div class="field"> 
             <div class="select">

                <select name="anak_id">
                    <option v-for="(invent, id) in kod_rek" :key="id" :value="id">
                    {{ invent }}
                    </option>
                </select>
            </div>
             </div>

                // and this field work normally

                <div class="field">
                    <label for="kode_rekening">kode rekening</label>
                    <input
                            type="text"
                            id="kode_rekening"
                            class="input"
                            :value="userData.kode_rekening"
                            @input="userData.kode_rekening = $event.target.value"
                            >
                    <div v-if="errors && errors.kode_rekening" class="text-danger">{{ errors.kode_rekening[0] }}</div>
                </div>

以及此导出默认值

 export default {
    data(){
        return{
            fields: {},
            errors: {},
            userData:{
                anak_id:'',
                kode_rekening:'',
                uraian:'',
                anggaran:'',
            },
             kod_rek:{},       

            isSubmited: true,
        }
    },

     created(){
            axios.get('/users/get_data_turunan_anak').then((res)=>{
                this.kod_rek = res.data
                //  console.log(res.data)
                }).catch((err) => {
                console.log(err)
            });

        }


      methods:{
        submited(){
            this.isSubmited = true;
        },
        submit() {
            this.errors = {};
            axios.post('/users/input_turunan_anak', this.userData).then(response => {
                window.location = response.data.redirect;
            }).catch(error => {
                if (error.response.status === 422) {
                this.errors = error.response.data.errors || {};
                }
            });
        },
    },

只有我的选择框不能存储在此输入上,这是什么问题,我的网络有错误

消息:“ SQLSTATE [23000]:违反完整性约束:1048列'anak_id'不能为空(SQL:插入turunan_anakanak_idkode_rekening,{{1} },uraiananggaranupdated_at

1 个答案:

答案 0 :(得分:0)

尝试对选择框使用@change事件。您也可以在此用例中使用v-model。 v-model指令将帮助您创建双向数据绑定。