Laravel! Как сравнить значение коллекции с текстом <input>? - PullRequest
Новая
       3

Laravel! Как сравнить значение коллекции с текстом <input>?

0 голосов
/ 01 октября 2019

Мне нужно сравнить значения элементов коллекции с текстом в шаблоне блэйда, когда пользователь нажимает кнопку.

Примерно так 

@foreach notes as note

@if $note->number == <input id="number" name="number">

<h2>$note->contente</h2>

@endif

@endforeach

Пожалуйста, как мне это сделать? вид сравнения?

1 Ответ

1 голос
/ 01 октября 2019

Это должно быть сделано с Javascript, Blade выводит HTML-код перед загрузкой Javascript или изменением ввода

Вот пример (не копировать, вставить) 

@foreach($notes as $note)

<h2 hidden>{{ $note->name }}</h2>
<input id="number" name="number"><br>

@endforeach
<button onclick="showCorrectNames()">Check</button>
<script>
    function showCorrectNames() {
        var inputs = document.getElementsByTagName("input");
        for (let input of inputs) {
            if (input.value === input.previousElementSibling.innerText) {
                input.previousElementSibling.hidden = false;
            }
        }
    }
</script>

Объяснение:

  • Всегда отмечать заголовок, который будет скрыт по умолчанию
  • Поместите вход рядом с ним и запросите его значение при нажатии кнопки
  • Прослушивание события нажатия накнопку и выполнить функцию Javascript
  • Получить полный список всех элементов ввода
  • Итерация по коллекции HTML
  • Если значение ввода соответствует предыдущему значению заголовка (внутренний текст) в DOM
  • Установить скрытый атрибут заголовка в false

Live Пример: 

function showCorrectNames() {
        var inputs = document.getElementsByTagName("input");
        for (let input of inputs) {
            if (input.value === input.previousElementSibling.innerText) {
                input.previousElementSibling.hidden = false;
            }
        }
    }
<h2 hidden>Cecelia Denesik Jr.</h2>
<input id="number" name="number"><br>


<h2 hidden>Cristian McCullough</h2>
<input id="number" name="number"><br>


<h2 hidden>Forest Pollich</h2>
<input id="number" name="number"><br>


<h2 hidden>Mckenna Jacobson</h2>
<input id="number" name="number"><br>


<h2 hidden>Rudolph Luettgen MD</h2>
<input id="number" name="number"><br>


<h2 hidden>Mazie Shields III</h2>
<input id="number" name="number"><br>


<h2 hidden>Mr. Arlo Hudson Sr.</h2>
<input id="number" name="number"><br>


<h2 hidden>Joanie Rogahn</h2>
<input id="number" name="number"><br>


<h2 hidden>Stephan Feil</h2>
<input id="number" name="number"><br>


<h2 hidden>Isadore Schultz</h2>
<input id="number" name="number"><br>

<button onclick="showCorrectNames()">Check</button>

Надеюсь, это поможет

...