Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

ruben777's avatar

Insert record associative table

I am trying to insert a record in the associative table when I insert a new website. request comes from a vue.js form

Website Model

public function checkers(): BelongsToMany
    {
        return $this->belongsToMany(Checker::class)->withPivot('is_active');
    }

Checker Model

public function websites(): BelongsToMany
    {
        return $this->belongsToMany(Website::class)->withPivot('is_active');
    }

my request comes as an array of IDs that I have to attach to one item that just has been created. here is the codes I tried :

$website->checkers()->attach([request('checkers')]);
$website->checkers()->syncWithPivotValues([request('checkers')], ['is_active'=>'1']);
foreach(request('checkers', []) as $checker_id) {
    $website->checkers()->attach([$checker_id]);
}

any help will be very appreciated

0 likes
9 replies
Armani's avatar

The name of form element should be array (input name="checkers[]") then you can do:

$website->checkers()->sync(request('checkers'));
ruben777's avatar

@Armani my form is like this :

 <input type="hidden" v-model="form.checkers" v-bind:value="checkers">
setup() {
        const form = useForm({
            name: null,
            url: null,
            user: null,
            checkers: []
        });

        return { form };
    },
 axios.get('https://website.fr/app/get-all-infos')
            .then((res) => {
                this.users = res.data.users
                res.data.checkers.forEach((checker) => {
                    this.checkers = checker.id
                    console.log(this.checkers);
                })
            })

I can see my data when I console.log(this.checkers)

Armani's avatar

@ruben777 First of all you don't need v-bind:value because v-model will does it for you automatically:

 <input type="hidden" v-model="form.checkers">

And you typed this.checkers I think it should be this.form.checkers, you can do this if you return just IDs:

this.form.checkers = res.data.checkers

You don't need forEach I think

ruben777's avatar

@Armani ok I tried without the foreach now I have an array of array, the last array contains all infos about the checker. also, I deleted hidden input which is now obselete

sr57's avatar

@ruben777

If you get an array

$website->checkers()->syncWithPivotValues(request('checkers'), ['is_active'=>'1']);
ruben777's avatar

ok, here is my solution :

vue.js

setup() {
    const form = useForm({
            name: null,
            url: null,
            user: null,
            checkers: null
    });

    return { form };
},

created() {
        axios.get('https://website.fr/app/get-all-infos')
            .then((res) => {
                this.users = res.data.users
                this.form.checkers = res.data.checkers
    })
},

laravel

 public function store(): RedirectResponse
    {
        $checker_ids = [];
        $checkers = request('checkers');
        foreach($checkers as $checker) {
            $checker_ids[] = $checker['id'];
        }
        $website = Website::create([
            'user_id'=>request('user'),
            'name'=>request('name'),
            'url'=>request('url'),
            'is_active'=>'1',
        ]);
        $website->checkers()->sync($checker_ids);
        return redirect()->route('admin-dashboard');
    }

thank you all for your help !

Please or to participate in this conversation.