Привязка модели Livewire при нажатии на другой элемент

У меня очень простая проблема. Всякий раз, когда я нажимаю на div, я хочу, чтобы data binding применялся к вводу файла.

<div>click me</div>
<input type = "file" wire:model = "photo"> <!-- while clicking on div, it should do the data binding to this file input  -->

Я искал его в документации, но не мог найти никакой подсказки. Возможно ли это сделать?

вы хотите открыть входной файл, когда вы нажимаете на div?

haruk1515 10.01.2023 12:36

@haruk1515 Точно

Zain Farooq 10.01.2023 12:41

Вы можете сделать то же самое с ярлыком, верно?

xenooooo 10.01.2023 14:54
Стоит ли изучать PHP в 2023-2024 годах?
Стоит ли изучать PHP в 2023-2024 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Symfony Station Communiqué - 7 июля 2023 г
Symfony Station Communiqué - 7 июля 2023 г
Это коммюнике первоначально появилось на Symfony Station .
Оживление вашего приложения Laravel: Понимание режима обслуживания
Оживление вашего приложения Laravel: Понимание режима обслуживания
Здравствуйте, разработчики! В сегодняшней статье мы рассмотрим важный аспект управления приложениями, который часто упускается из виду в суете...
Установка и настройка Nginx и PHP на Ubuntu-сервере
Установка и настройка Nginx и PHP на Ubuntu-сервере
В этот раз я сделаю руководство по установке и настройке nginx и php на Ubuntu OS.
Коллекции в Laravel более простым способом
Коллекции в Laravel более простым способом
Привет, читатели, сегодня мы узнаем о коллекциях. В Laravel коллекции - это способ манипулировать массивами и играть с массивами данных. Благодаря...
Как установить PHP на Mac
Как установить PHP на Mac
PHP - это популярный язык программирования, который используется для разработки веб-приложений. Если вы используете Mac и хотите разрабатывать...
0
3
51
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Okei я искал и тестировал, чтобы увидеть, смогу ли я это сделать, и есть решение с jquery:

<div id = "trigger">click me</div>
<input type = "file" id = "file_input" wire:model = "photo">

$("#trigger").unbind("click").bind("click", function () {
    $("#file_input").click();
});

я отдам должное, где я нашел ответ:

срабатывание кнопки ввода файла

если ваша идея состоит в том, чтобы использовать только livewire, вы можете создать функцию

public function fileTrigger(){
    $this->dispatchBrowserEvent('TriggerFilem');
}

добавьте это в js:

window.addEventListener('TriggerFilem', e => {
    $("#trigger").unbind("click").bind("click", function () {
        $("#file_input").click();
});
}); 

и в представлении:

<div wire:click = "fileTrigger()" id = "trigger">click me</div>
<input type = "file" id = "file_input" wire:model = "photo">

Редактировать:

Если вы не хотите использовать jquery, я тестировал решение только на js:

document.getElementById('trigger').addEventListener("click",() => {
    document.getElementById('file_input').click();
    
    });

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

Это хорошее решение, но я хочу без jQuery. Даже во втором решении используется jQuery.

Zain Farooq 10.01.2023 14:08

@ZainFarooq я добавил еще одно решение только для js, без jquery, надеюсь, это поможет

haruk1515 10.01.2023 14:25

Я пробую это. надеюсь это работает

Zain Farooq 10.01.2023 14:43

Другие вопросы по теме