Вопросы Теги

Выполнить перемещение элемента списка из одного элемента ul в другой элемент ul

Добавить методы отношений к вашим моделям. UserModel 

public function professions()
{
    return $this->hasMany(Profession::class);
}

ПрофессияModel: 

public function users()
{
    return $this->hasMany(User::class);
}

И теперь вы можете сделать это: 

$user = User::where('user_group', 2)->with('professions')->get();
dd($user->professions);
0
задан dktown 20 January 2019 в 00:33
поделиться

2 ответа

Похоже, что вы запрашиваете селектор .completedLabel глобально, когда вам просто нужно найти его внутри элемента, по которому щелкнули.

Может работать область действия селектора запросов до элемента, который вы храните в listItem . Вот пример: 

const label = listItem.querySelector('.completedLabel');

Таким образом, он работает с повторным использованием вашего образца кода: 

//move li item to completed list when checkbox selected
ul.addEventListener('change', (e) => {
	const checkbox = e.target;
	const checked = checkbox.checked;
	const listItem = e.target.parentNode.parentNode;
	const completedItems = document.querySelector('.completedItems');
	const label = listItem.querySelector('.completedLabel');

	if (checked) {
		completedItems.appendChild(listItem);
		label.style.display = 'none';
	}
});

Однако реализация может быть немного улучшена.

0
ответ дан James Garcia 20 January 2019 в 00:33
поделиться

Не могли бы вы пересмотреть свою стратегию в решении этого дела? Рекомендуется работать с данными, такими как массивы и объекты, вместо узлов DOM.

Пожалуйста, рассмотрите этот пример 

const form = document.forms.form;
const todoList = document.querySelector('#todoList');
const completedList = document.querySelector('#completedList');
const tasks = [];

form.addEventListener('submit', handleSubmit, true);

todoList.addEventListener('change', handleInputChange, true);

function handleSubmit(event) {
    event.preventDefault();

    const task = this.task;

    if (task.value === '') {
        return;
    }

    const item = createTask(task.value);

    tasks.push(item);

    task.value = '';

    syncTodoList();
}

function handleInputChange(event) {
    const target = event.target;

    if (target.nodeName === 'INPUT') {
        const id = event.target.id;
        const task = tasks.find(task => task.id === parseInt(id, 10));

        task.status = 'completed';

        syncTodoList();
        syncCompletedList();
    }
}

function createTask(task) {
    return {
        id: Date.now(),
        text: task,
        status: 'todo'
    };
}

function syncTodoList() {
    const todos = tasks
        .filter(task => task.status === 'todo')
        .map(task => `<li>${task.text} <input type="checkbox" id="${task.id}"></li>`)
        .join('');

    todoList.innerHTML = todos;
}

function syncCompletedList() {
    const completeds = tasks
        .filter(task => task.status === 'completed')
        .map(task => `<li>${task.text}</li>`)
        .join('');

    completedList.innerHTML = completeds;
}
<form name="form">
    <input id="task">
    <button>Send</button>
</form>

<p>Todo</p>
<ul id="todoList"></ul>

<p>Completed</p>
<ul id="completedList"></ul>

0
ответ дан user615274 20 January 2019 в 00:33
поделиться
Другие вопросы по тегам:

Похожие вопросы: