es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Error en el modelo de enlace Livewire del botón de opción de radio.

Estoy intentando construir un sistema de encuestas usando Livewire, pero tengo algunos errores.

Aquí está mi Blade:

@foreach ($questions as $index => $question)
    <div class="row">
        <div class="box-header with-border">
            <i class="fa fa-question-circle text-black fs-20 me-10"></i>
            <h4 class="box-title">{{ $question->title }}</h4>
        </div>
        <div class="box-body">
            <div class="demo-radio-button">
                @foreach ($answers as $key => $answer)
                    <input wire:model="question{{ $question->id }}" type="radio" id="answer{{ $question->id }}{{ $key }}" class="radio-col-primary" value="{{ $key }}">
                    <label for="answer{{ $question->id }}{{ $key }}">{{ $answer }}</label>
                @endforeach
                @error('question')
                    <div class="text-danger text-bold">{{$message}}</div>
                @enderror
            </div>
        </div>
    </div>
@endforeach

Mi clase Livewire:

public $question = [];

public function render() {
    $category = PollCategory::findOrFail($this->category->id);
    $subCategories = PollSubCategory::where('poll_category_id', $category->id)->get();
    $answers = PollAnswer::all();
    return view('livewire.polls', compact('category', 'subCategories', 'answers'));
}

El error es:

Propiedad [$question41] no encontrada en el componente: [polls]

¿Alguna ayuda, por favor?

Tags:  ,

Answer

  1. Avatar for davy.ai

    Parece que el error de Livewire es causado por la variable $question que no está definida correctamente. En el archivo blade, estás utilizando la directiva wire:model para enlazar la entrada con $question{{ $question->id }}, lo que significa que Livewire espera encontrar una propiedad llamada $question41 (suponiendo que $question->id es 41).

    Sin embargo, en la clase de Livewire, has definido $question como un array, lo cual no es compatible con el nombre de propiedad esperado. Para solucionar esto, debes cambiar $question para que sea un array anidado, donde las claves sean los IDs de las preguntas y los valores sean los valores de las respuestas seleccionadas.

    Aquí está la clase de Livewire actualizada:

    public $question = [];
    
    public function render() {
        $category = PollCategory::findOrFail($this->category->id);
        $subCategories = PollSubCategory::where('poll_category_id', $category->id)->get();
        $answers = PollAnswer::all();
    
        // rellenar $question con valores predeterminados para cada pregunta
        foreach ($subCategories as $subCategory) {
            foreach ($subCategory->questions as $question) {
                $this->question[$question->id] = null;
            }
        }
    
        return view('livewire.polls', compact('category', 'subCategories', 'answers'));
    }
    

    Ten en cuenta que ahora estamos inicializando $question como un array asociativo, donde las claves son los IDs de las preguntas y los valores son null. Esto es para evitar los errores de “Propiedad no encontrada”.

    En tu archivo blade, necesitarás actualizar la directiva wire:model para utilizar la clave correcta de $question para cada pregunta:

    <input wire:model="question.{{ $question->id }}" type="radio" id="answer{{ $question->id }}{{ $key }}" class="radio-col-primary" value="{{ $key }}">
    

    Observa el prefijo question. antes del ID de la pregunta, lo cual indica que estamos enlazando a la subclave del array question para la pregunta actual.

    Con estos cambios, tu componente Livewire de encuestas debería funcionar sin errores.

Comments are closed.