I am testing Livewire and would like to do the following:
From a component, which has a button, call from there to my livewire component to display an iframe with the path provided by the button but I can't get it to make the call.
My component have the following code (/resources/views/components/widgets/lista-plantillas.blade.php
):
<div class="card-group">@foreach ($plantillas as $plantilla)<div class="card" wire:key="plantilla-{{ $plantilla->id }}"><div class="card-body"><h6 class="card-title">{!! $plantilla->nombre !!}</h6><small class="card-body">Creada el: {{ $plantilla->created_at }}</small></div><div class="card-footer text-muted"> {{-- <input @click="$wire.dispatch('carga-event')" type="radio" class="btn-check" name="plantilla" id="success-outlined-{{$plantilla->id}}" autocomplete="off" value="{{$plantilla->id}}"> --}}<input type="radio" class="btn-check" name="plantilla" id="success-outlined-{{ $plantilla->id }}" autocomplete="off" value="{{$plantilla->id}}" @click="$wire.dispatch('carga-event', {id: {{ $plantilla->id }} })" /><label class="btn btn-outline-success" for="success-outlined-{{$plantilla->id}}">¡Usar para email!</label></div></div>@endforeach
And the principal file (/resources/views/crea-comunicado.blade.php
) have the code:
<div class="accordion-item"><h2 class="accordion-header"><button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#extraComunicado" aria-expanded="false" aria-controls="extraComunicado"><span class="badge bg-primary">3</span> Adjuntos y programación</button></h2><div id="extraComunicado" class="accordion-collapse collapse" data-bs-parent="#accionesComunicado"><div class="accordion-body"><div class="row"><div class="col-md-6 col-sm-3"><label for="adjuntos" class="form-label">Adjuntar ficheros:</label><input type="file" class="form-control" id="adjuntos" name="adjuntos" multiple /></div> <div class="col-md-6 col-sm-3" id="programaEnvio"><label for="programado" class="form-label">Programar envío: </label><div class="input-group mb-3"><label class="input-group-text" for="programado"><i class="bi bi-alarm-fill"></i></label><input class="form-control" type="datetime-local" name="programado" id="programado" multiple=""></div></div> </div></div></div></div><div class="accordion-item"><h2 class="accordion-header"><button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#previaComunicado" aria-expanded="false" aria-controls="previaComunicado"><span class="badge bg-success">5</span> Vista Previa</button></h2><div id="previaComunicado" class="accordion-collapse collapse" data-bs-parent="#accionesComunicado"><div class="container"><div class="row"><div class="col-md-4 "><div class="accordion-body"><div id="datos-adjuntos"><button type="button" class="btn btn-sm btn-primary position-relative" style="cursor:inherit"> Ficheros adjuntos<span class="position-absolute top-0 start-100 translate-middle badge rounded-pill" id="numero-adjuntos"> </span></button><ul class="list-group m-2" id="listado-adjuntos"></ul><button type="button" class="btn btn-sm text-light" id="programado-mail"></button></div><div id="sacacontenido"></div></div></div><div class="col-md-8 "><div class="accordion-body"><small id="previa-asunto"></small><livewire:previa-plantilla /></div></div></div></div></div></div>
And my liveware view (/resources/views/livewire
) is just a test like:
<div> <p>Mira donde estoy</p> {{ $url_file }}</div>
And my liveware component (/app/Livewire/PreviaPlantilla.php
) is:
use App\Models\Plantilla;use Livewire\Attributes\On;use Livewire\Component;class PreviaPlantilla extends Component{ public $count=0; public function render() { return view('livewire.previa-plantilla'); } #[On("carga-event")] public function carga(){ $this->count++; }}