javascript - 在数据库中插入数据时数组到字符串转换错误

标签 javascript laravel vue.js

我正在使用 Vue 多选。我想将所选选项的 ID 保存在数据库中,但不幸的是我收到数组到字符串转换的错误。我将 site_id 和管理员都放入 fillables 中。我在 Controller 端获取了选定选项的数组,但我认为问题出在插入方法中,该方法引发错误。希望你能理解我的问题。

HTML:

                        <form @submit.prevent="addAllocateSites">
                            <div class="row">
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label class="typo__label">Select Site</label>
                                        <multiselect v-model="form.selected_sites" :options="options"
                                                     :multiple="true"
                                                     :close-on-select="false"
                                                     :clear-on-select="false" :preserve-search="true"
                                                     placeholder="Pick Site"
                                                     name = "selected_sites"
                                                     label="asset_name" track-by="asset_name"
                                                     :class="{ 'is-invalid': form.errors.has('selected_sites') }">
                                            <template slot="selection" slot-scope="{ values, search, isOpen }"><span
                                                class="multiselect__single" v-if="values.length &amp;&amp; !isOpen">{{ values.length }} Sites selected</span>
                                            </template>
                                        </multiselect>
                                        <pre class="language-json"><code>{{form.selected_sites}}</code></pre>
                                    </div>
                                    <has-error :form="form" field="selected_sites"></has-error>
                                    <button type="submit" class="btn btn-primary">Save</button>

                                </div>
                            </div>
                            <br>
                        </form>


脚本:


<script>

    import Multiselect from 'vue-multiselect';
    import Form from 'vform';


    export default {

        components: {
            Multiselect
        },
        data() {
            return {

                form: new Form({
                    selected_sites: [],
                }),
                options: []
            }
        },
        methods: {
            getSites() {
                axios.get('api/sites').then(data => {
                    this.options = data.data;
                    console.log(data.data)
                }, function (data) {
                    console.log(data)
                });
            },
            addAllocateSites(){

                this.form.post('api/allocate_sites').then(() => {

                    toast.fire({
                        type: 'success',
                        title: 'Sites Allocated Successfully'
                    });
                });

            }
        },
        mounted() {
            this.getSites();
            console.log('Component mounted.')
        }
    }
</script>

Controller :

    public function store(Request $request)
    {
        $siteIds = $request->input('selected_sites');

//        dd($siteIds);

        $validation = Validator::make($request->all(), [
            'selected_sites' => 'required|array',
        ]);

        if ($validation->fails()) {
            return ['Fields required'];
        } else {

            for ($i = 1; $i < count($siteIds); $i++) {

                $sites[] = [

                    "site_id" => $siteIds[$i],
                    "administrator_id" => Auth::user()->id,
                ];
            }

            $insertData = AllocateSites::insert($sites);

            if ($insertData) {
                return ['Sites Allocated'];
            } else {
                return ['Failed to add data'];
            }
        }
    }


最佳答案

我找到了解决方案

for ($i = 0; $i < count($siteIds); $i++) {

         $sites[] = [
            "site_id" => $siteIds[$i]['id'],
            "administrator_id" => Auth::user()->id,
             ];
   }

关于javascript - 在数据库中插入数据时数组到字符串转换错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58013947/

相关文章:

javascript - 不使用循环修改数组内的对象

css - 如何在 Vuetify 中更改 v-text-field 宽度?

vue.js - 如何分解我的 vuex 文件?

javascript - 将数组值传递给js

javascript - 我想更新 .json 文件,请告诉我如何操作

laravel - 工匠 : "Command not found"

php - 使用 2 个不同的数据在图表 laravel 中显示

mysql - 无法使用 Laravel 5 迁移添加外键约束

vue.js - 载波: upload an image from vue front to rails api

php - 服务器重启后javascript不工作