Изменение элементов базы данных, отображаемых в форме на основе выбора ввода в Laravel

Question

Я создаю форму, где пользователю сначала предоставляются две радиокнопки:

<div class="parent">
  <input class="myRadio" type="radio" name="var" value="choice1" required>
  <input class="myRadio" type="radio" name="var" value="choice2" required>
</div>

В зависимости от того, что выбрал пользователь, я хочу отобразить массив элементов, который соответствует выбранному выбору:

@foreach ($elements as $key=>$element)
@if($element['choice'] == 'choice1')
  <img src="{{$element['src']}}">
@endif
@endforeach

Но, как уже упоминалось, эти разделы находятся в одном элементе формы и загружаются одновременно, что затрудняет вызов базы данных. Есть ли простой способ для меня, чтобы сохранить это в основном интерфейс? Я понимаю, что могу обновить раздел с помощью .load(), но я боюсь, что это средняя часть. Я думаю, что я слишком много думаю.

Редактировать: Как пояснение, я теоретически хочу добиться замены @if($element['choice'] == 'choice1') с помощью @if($element['choice'] == input.value), затем перезагрузите зацикленную секцию foreach формы.

Answer 1

Вы можете использовать javascript. (В этом ответе я буду называть radiobuttons-> selector и elements -> selection)

1.Пропустить все данные из контроллера для просмотра.

2.Calssify выборки будут показываться друг с другом при помощи select каждый селектор и назначьте им css класс и поместите их в отдельную форму, но общую цель.

3.assign onclick событие для каждого селектора и вызовите различные функции в javascript.

4.В каждой функции используйте show() для отображения нужных элементов и hide() для скрытия тех, которые вам нравятся.

Пример :

 <input onclick="rad1Select()">
  <input onclick="rad2Select()">
<form name="form1" action="/postpage" method="post">
<input  class="s1" value="{{fromModel}}">
<input class="s1" value="{{fromValue}}">
<button type="submit">Submit</button>
</form>

<form name="form2" action="/postpage" method="post">
<input  class="s2" value="{{fromModel}}">
<input class="s2" value="{{fromValue}}">
<button type="submit">Submit</button>
</form>

( InScript)

<script>
function rad1Select()
{
$(".s1").show();
$(".s2").hide();
}

function rad2Select(){
$(".s1").hide();
$(".s2").show();
}
</script>

Вы можете передавать формы различным действиям для лучшей проверки в них.