I have a Laravel 10, Livewire 3, Alpine JS application. On one of the blade files, I use the alpine x-for to loop through and add an input for each entry. I need to validate each input on change. I'm using a custom validation rule and calling $fail(...); if there's an error. the problem is that i cannot figure out how to display the validation error inside the x-for template under the input that failed validation. it displays after the looped inputs if i put the span element outside of the template but then i can't use the index variable from the x-for.

blade file:

<template x-for="(value, index) in some_array" :key="value_" + index>
    <div>
        <!-- input -->

        <span x-show="$errors.has('...' + index)" x-text="$errors.first('...' + index)">
   </div>
</template>
// span works if i put it here

i've tried using $wire.errors, @error, @if (checking for the error bag), and wire:show also but nothing is working inside the template. is there a way to get this to work or do i need to use @foreach instead of x-for? thanks.

This is what's in the error bag when i try adding a duplicate url in the third input spot and it fails validation:

{"some_array.2":["This URL has already been reported. Please contact support for further questions."]}

this is what $errors->all() looks like in the blade file:

array (
  0 => 'This URL has already been reported. Please contact support for further questions.',
)