How to get value from JS generated radio component

hi everyone;

I have a wizard with a text-Input
after every keypress the value is sent to an API, the return JSON builds a HTML table with a Radio input so the user can select.

so far, so good, but I'm not able to get the value of the selected radio-Item into my PHP, I can read it in JS, write into log, but it end there.

here is the validation I'm trying to do. The LOG shows, that the function is called, but I can't get the value

->beforeValidation(function () {
$this->MyFunction();
}),

that's my function

public function MyFunction()
{
Log::info('MeineFunktion wurde vor der Validierung aufgerufen.');

$selectedTopicId = data_get($this->form->getState(), 'selectedNewTopicPermission'); // this doesn't work

this is how the relevant part of the table is generated

row1.innerHTML =


                    <td class="text-xs" rowspan="2">
                        <input type="radio" name="SelectedTopicPermission" value="${item.topic_is_allowed_for_someones_id}" onclick="updateSelectedTopicId(${item.topic_is_allowed_for_someones_id})">
                    </td>
                    <td class="text-xs">${item.topic_name}</td>
                    <td class="text-xs">${item.provider_name}</td>
                    <td class="text-xs">${item.consumer_name}</td>


                    <td class="text-xs" rowspan="2">
                        <input type="radio" name="SelectedTopicPermission" value="${item.topic_is_allowed_for_someones_id}" onclick="updateSelectedTopicId(${item.topic_is_allowed_for_someones_id})">
                    </td>
                    <td class="text-xs">${item.topic_name}</td>
                    <td class="text-xs">${item.provider_name}</td>
                    <td class="text-xs">${item.consumer_name}</td>

;

tried something with onclick(), to move the value to a hidden filament component, with no luck. Is it possible to read that radio value direct?

I have no idea.

Thx for listening, any help appreciated:
Best regards
Peter

Solution

thanks for the hint,I will have a look at it. For now I solved this special task by writing the data (it's ONE number) to a cookie and reading it in php.

Jump to solution

PeterWilliamOP•11/6/24, 9:02 PM

interesting: while trying to find a livewire solution I get this:

Public property [$selectedTopicId] not found on component: [menu-logins]

there is no component of that name, the word doesn't exist in my source code.

had been trying this:

window.updateSelectedTopicId = function(topicId) {

console.log("setze jetzt Selected Topic ID über Livewire auf:", topicId);

const livewireComponentId = document.querySelector('[wire\:id]').getAttribute('wire:id');
if (!livewireComponentId) {
console.error("Livewire-Komponente nicht gefunden.");
return;
}

const livewireComponent = Livewire.find(livewireComponentId);
livewireComponent.set('selectedTopicId', topicId); // Setzt den Wert von 'selectedTopicId' in Livewire
console.log("Selected Topic ID über Livewire gesetzt auf:", topicId);
};

PPeterWilliam hi everyone; I have a wizard with a text-Input after every keypress the value i...

LeandroFerreira•11/7/24, 8:07 PM

maybe using AlpineJs ?

Laravel

Alpine | Laravel

A full-stack framework for Laravel that takes the pain out of building dynamic UIs.

Solution

PeterWilliam•11/8/24, 7:36 AM

thanks for the hint,I will have a look at it. For now I solved this special task by writing the data (it's ONE number) to a cookie and reading it in php.