F
Filament•3w ago
Jon Mason

Help with custom field

I have a custom input field that works great in any normal form, but in a repeater, whenever a value is entered into one item in a repeater, the same value is applied to the field in all the other repeater items as well. I suspect that it's related to the blade file, but I have no idea how to go about fixing it. Even some steps to take to investigate would be super helpful. 
@php
    $prefixLabel = $getPrefixLabel();
    $isDisabled = $isDisabled();
@endphp

<x-dynamic-component :component="$getFieldWrapperView()" :field="$field">

    <div x-data="{
    state: $wire.entangle('{{ $getStatePath() }}'),
    updateState() {
        this.$wire.set('{{ $getStatePath() }}', this.state);
    }
}">
        <x-filament::input.wrapper :prefix="$prefixLabel" :disabled="$isDisabled">
            <x-filament::input type="text" x-model="state" @blur="updateState" />
        </x-filament::input.wrapper>
    </div>
</x-dynamic-component>
@php
    $prefixLabel = $getPrefixLabel();
    $isDisabled = $isDisabled();
@endphp

<x-dynamic-component :component="$getFieldWrapperView()" :field="$field">

    <div x-data="{
    state: $wire.entangle('{{ $getStatePath() }}'),
    updateState() {
        this.$wire.set('{{ $getStatePath() }}', this.state);
    }
}">
        <x-filament::input.wrapper :prefix="$prefixLabel" :disabled="$isDisabled">
            <x-filament::input type="text" x-model="state" @blur="updateState" />
        </x-filament::input.wrapper>
    </div>
</x-dynamic-component>
1 Reply
Jon Mason
Jon MasonOP•3w ago
it has something to do with $getStatePath(), and I think I need to somehow use absoluteStatePath instead. I was able to do this and at least get the ID on the input to match the absolute state path, so it's no longer just like my-field, now it's mountedTableActionsData.0.lines.my-field 
@php
    $extraAlpineAttributes = $getExtraAlpineAttributes();
    $prefixLabel = $getPrefixLabel();
    $isDisabled = $isDisabled();
    $id = $getId();
@endphp

<x-dynamic-component :component="$getFieldWrapperView()" :field="$field">

    <div x-data="{
    state: $wire.entangle('{{ $getStatePath(true) }}'),
    updateState() {
        this.$wire.set('{{ $getStatePath(true) }}', this.state);
    }
}">
        <x-filament::input.wrapper :prefix="$prefixLabel" :disabled="$isDisabled">
            <x-filament::input type="text" x-model="state" @blur="updateState" :attributes="\Filament\Support\prepare_inherited_attributes($getExtraInputAttributeBag())
                ->merge($extraAlpineAttributes, escape: false)
                ->merge([
                    'disabled' => $isDisabled,
                    'id' => $id,
                ])" />
        </x-filament::input.wrapper>
    </div>
</x-dynamic-component>
@php
    $extraAlpineAttributes = $getExtraAlpineAttributes();
    $prefixLabel = $getPrefixLabel();
    $isDisabled = $isDisabled();
    $id = $getId();
@endphp

<x-dynamic-component :component="$getFieldWrapperView()" :field="$field">

    <div x-data="{
    state: $wire.entangle('{{ $getStatePath(true) }}'),
    updateState() {
        this.$wire.set('{{ $getStatePath(true) }}', this.state);
    }
}">
        <x-filament::input.wrapper :prefix="$prefixLabel" :disabled="$isDisabled">
            <x-filament::input type="text" x-model="state" @blur="updateState" :attributes="\Filament\Support\prepare_inherited_attributes($getExtraInputAttributeBag())
                ->merge($extraAlpineAttributes, escape: false)
                ->merge([
                    'disabled' => $isDisabled,
                    'id' => $id,
                ])" />
        </x-filament::input.wrapper>
    </div>
</x-dynamic-component>
I think it's a step in the right direction, but it didn't resolve the issue.

Did you find this page helpful?