Hey! Just as an update, looks like Caleb's adding in a third param that you can set via wire:sort:group-id to make it so you aren't forced to create a component:

https://github.com/livewire/livewire/pull/9938

Hi @swaz, yes, I believe so. In my context, I have a form that has sections and each section has questions. I made each section its own livewire component (see simplified version below), but wired them all up to the same wire:sort:group. When I move a question, the moveQuestion() method is only triggered on the receiving section. I have the $this->section parent info available on that component, so I can tell which section should now have the question.

Hopefully this code below feels straightforward?

<?php

use App\Models\FormSection;
use Livewire\Component;


new class extends Component
{
    public FormSection $section;

    public function moveQuestion(string $item, $position)
    {
        dd($this->section->id);

        // Insert DB reordering logic here (as we now have $item, $position, and parent ($section))
    }
};
?>

<div wire:sort="moveQuestion" wire:sort:group="questions">
    @foreach($section->questions as $question)
    <div class="m-4" wire:sort:item="{{ $question->id }}">
            {{ $question->question }}
    </div>
    @endforeach
</div> 

Hi @swaz, yes, I believe so. In my context, I have a form that has sections and each section has questions. I made each section its own livewire component (see simplified version below), but wired them all up to the same wire:sort:group. When I move a question, the moveQuestion() method is only triggered on the receiving section. I have the $this->section parent info available on that component, so I can tell which section should now have the question.

Hopefully this code below feels straightforward?

<?php

use App\Models\FormSection;
use Livewire\Component;


new class extends Component
{
    public FormSection $section;

    public function moveQuestion(string $item, $position)
    {
        dd($this->section->id);

        // Insert DB reordering logic here (as we now have $item, $position, and parent ($section))
    }
};
?>

<div wire:sort="moveQuestion" wire:sort:group="questions">
    @foreach($section->questions as $question)
    <div class="m-4" wire:sort:item="{{ $question->id }}">
            {{ $question->question }}
    </div>
    @endforeach
</div> 

Hello!

I was also encountering this issue and found this video of Caleb demonstrating wire:sort:group ( https://www.youtube.com/watch?v=A8AXghy-XzM at about 14:50).

The difference between his demonstration and my situation was that he had built out a component for the parent groups - I hadn't. He used wire:sort:group to tie them together, and moving a child triggers the sortChild logic on only the receiving parent group component, so you have the context available within that component instance to know which parent we're talking about.

I still don't see how the example in the docs is working (without something like @rihulfaakbar's solution), but hopefully this is an alternative for you @swaz?