Получение отношений после кликов пользователя

Question

Получение отношений после кликов пользователя

Непонятно, а? название Да, я знаю, но теперь знаю, как лучше описать это.

У меня есть следующее:
— 9 целей
— у каждой задачи есть 3 пакета
— каждый пакет имеет 1 packageinfo // не имеет значения для этого вопроса.

// Relations
- Objective->hasMany('Package');
- Package->belongsToMany('Objective');

На странице моего сайта я показываю все (9) целей.
Когда пользователь нажимает на цель, я хотел бы, чтобы отображались соответствующие пакеты. Но мне действительно непонятно, как это сделать (на стороне клиента) ..

Я старался:

@foreach($objectives as $objective)
<div class="col-4">
<span class="{{$objective->icon}}"></span>
{{$objective->naam}}
</div>
@foreach($objective->packages() as $package)
<div style="">
{{$package->title}}
{{$package->information}}
{{$package->link}}
</div>
@endforeach
@endforeach

это не показывает связанные пакеты и не дает мне ошибку. Кроме того. Это даже правильно, что я делаю?

Я также пытался получить пакеты с jquery, но это не сработало ..
Мой вопрос … Как я могу лучше всего сделать выше? (пакеты должны быть скрыты до тех пор, пока пользователь не нажмет на цель, без каких-либо изменений страницы или чего-либо еще)

—————— РЕДАКТИРОВАТЬ

Игнорируйте приведенный выше код, пожалуйста.

У меня был следующий код:

    <script>
$(document).ready(function(){
$('.objective').on('click',function(){

var objective = $(this).data('titel');
document.getElementById('objective').value = $(this).data('title');

// this doesnt work i know, but its here to explain the stuff beneath this.
$id = document.getElementById('objective').value;

// code which gets the id of hidden input and finds all packages related to this objective id.
// i.e. Package::with('objectives')->where('id','=', $id)->get();
// save it as $packages. Which will fill the second foreach

});});

</script>

<div class="col-12">
<input type="hidden" name="objective" id="objective" />
@foreach($objectives as $objective)
<div class="col-4 objective" data-title="{{$objective->id}}">
<span class="{{$objective->icon}}"></span>
{{$objective->name}}
</div>
@endforeach
</div>

// the two have to be seperate from eachother in order to succesfully show related packages.
<div class="col-12">
@foreach($packages as $package)
<div>
{{$package->title}}
<?php $information = explode(',',$package->information); ?>
@foreach($information as $info)
{{$info}}<br />
@endforeach
{{$package->link}}
</div>
@endforeach
</div>

0

jquery laravel laravel-4 php relationships

Решение

Другие решения

Что касается PHP / Laravel, измените @foreach заявление об удалении () после packages:

@foreach($objective->packages as $package)

(Это предполагает, что ваш hasMany отношение называется packages… перепроверьте это в вашей объективной модели.)

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

$objectives = Objective::with('packages')->get();

…и передать все $objectives результат для просмотра. Теперь, в представлении, у вас есть все цели и пакеты, и вам не нужно динамически извлекать их, используя JavaScript или сопоставление идентификаторов.

Что касается ответа на щелчок, как уже говорили другие, вам нужно переключить показ / скрытие, используя javascript в качестве ответа на onClick,

Если вы хотите, чтобы ваш список пакетов был отделен от того, где отображаются ваши цели, то есть:

---
Package 1
Package 2
Package 3
...
---
Objectives (of the chosen package above)
---

…затем просто разделите петли в макете и покажите / скройте <div> на основе идентификатора выбранного пакета (который вы можете сохранить в data атрибут, а не скрытое поле ввода).

<div id="objectives">
@foreach($objectives as $objective)
<div class="objective" data-objective-id="{{$objective->id}}">
{{$objective->naam}}
</div>
@endforeach
</div>

<div id="packages">
@foreach($objectives as $objective)
<div id="{{$objective->id}}" class="hide">
@foreach($packages as $package)
<div>
{{$package->title}}
</div>
@endforeach
</div>
@endforeach
</div>

Тогда ваш jQuery отреагирует на щелчок по цели, прочитав objectiveId значение данных по нажатым <div> с помощью .data( "objectiveId" ) (или вы можете сохранить идентификатор в <a> тэг ссылки Пакет), затем showв соответствующем пакете <div> ниже, который имеет идентификатор <objectiveId>, В div вашего пакета уже были предварительно введены данные, поэтому нет необходимости продолжать делать вызовы базы данных для извлечения данных при щелчке по Objective.

0

Источник

Accepted Answer

Есть много способов сделать это. Вы можете сделать самопубликующую страницу PHP или изменить innerHTML или же outerHTML с помощью JavaScript на нажатие элемента с onClick Атрибут HTML.

0