Cannot find parent element in DOM tree containing attribute: [wire:id] - laravel

I am laravel developer and developing a real time chat room using liveware , i am trying to open chat when i click to user but unfortunatly i am getting error https://flareapp.io/share/OmVDe437#F47 please help me how can resolved that ? thank u.
I am also getting error in console.
app\Http\Livewire\Messaging.php
public $selectedConservation;
public function mount(){
$this->selectedConservation = Conservation::query()
->where('sender_id',Auth::user()->id)
->orwhere('reciever_id',Auth::user()->id)
->first();
}
public function viewMessages($conservationsId){
$this->selectedConservation =
Conservation::findorFail($conservationsId);
}
public function render()
{
$conservation = Conservation::query()
->where('sender_id',Auth::user()->id)
->orwhere('reciever_id',Auth::user()->id)
->get();
return view('livewire.messaging',[
'conservation' => $conservation,
]);
}
resources\views\livewire\messaging.blade.php
#foreach ($conservation as $conservations)
<a href="#" wire:click.prevent="viewMessages({{ $conservations->id}} )">
<div class="user-card rounded bg-dark bg-opacity-10 mb-1">
<div class="mx-2">
<div class="d-flex pt-3">
<img class="rounded-circle" width="48px" height="48px" src="{{Config('wfh.file').$conservations->reciever->avator}}" alt="">
<div class="notification-text ms-3 w-100">
<span class="username fw-bold">{{$conservations->reciever->full_name}}</span>
<span class="float-end small"></span>
<p class="mt-1 text-muted">You: </p>
</div>
</div>
</div>
</div>
</a>
#endforeach

Check out the documentation on Dom Diffing Issues. It looks like you need to add a wire:key="{{ $conversations->id }}" attribute into your a tag so that Livewire can track changes to the list of conversations.

Related

How the display the data that nested in the array (Laravel Vue)

Sorry. I face some problem on how to display the data that nested in array.(Vue js)
Here is the return array
I would to show the data in total_billed_by_year
I tried several other attempts but nothing works.
Could please someone help me out with this?
getInfo(index){
this.popup = true;
this.inquiryForm.total_contractual=this.pageData.ppr_data[index].total_contractual;
this.inquiryForm.bil_year =this.pageData.ppr_data[index].total_billed_by_year[index].bil_year;
this.inquiryForm.bil_total_amount =this.pageData.ppr_data[index].total_billed_year.bil_total_amount;
},
<vs-popup :active.sync="popup">
<div class="vx-row mb-base">
<div class="vx-col lg:w-1/2 w-full mb-base">
<vx-card
title="Total Bill"
icon="/images/task.png"
headerClass="bg-dark pb-6"
titleColor="#fff"
subtitleColor="#fff"
>
<template slot="no-body">
<div
id=""
class="transition-all duration-500 ease-in-out p-4"
>
<div class="grid lg:grid-cols-3 grid-cols-1">
<div class="mt-5 ml-2">
<h5>Total Contractual Amount</h5>
<div class="text-lg">
<div v-if="inquiryForm.total_contractual">
<div>RM {{inquiryForm.total_contractual}} </div>
</div><div v-else>-</div></div>
</div>
<div class="mt-5 ml-2">
<h5>Bill {{inquiryForm.bil_year}} </h5>
<div class="text-lg">
<div>RM {{inquiryForm.bil_total_amount}}
</div>
</div>
</div>
</div>
</template>
</vx-card>
</div>
</div>
</vs-popup>
<vs-list-item
class="hover:shadow"
v-for="(tr, index) in ppr"
v-bind:key="index"
>
<template slot="subtitle">
<div #click="getInfo(index)" class="cursor-pointer">{{tr.id}}</div>
</template>{{tr.total_billed_by_year[index].bil_year}}
<span class="font-bold truncate overflow-auto">{{tr.month}} -{{tr.year}}
<p v-for="(bill,ind) in tr.total_billed_by_year" v-bind:key="ind">
{{bill.bil_year}}{{bill.bil_total_amount}}
</p>
</span>
</vs-list-item>
I think the easiest way would be make your column total_bil_year to return as a array via casting from its model. Something like below (if total_billed_by_year column is a json column)
protected $casts = [
'total_billed_by_year' => 'array'
];
Based on the image you attached to the question shows that it is returned as a json. So you can convert it as object at vue also. Something like below
JSON.parse(tr.total_billed_by_year) which will convert into a array and that array contain the object. See the below image. I just reproduced it at console
you can use it like below. Or just make a function to convert your jsons to objects where you can use it when you want
</template>{{JSON.parse(tr.total_billed_by_year)[0].bil_year}}
baby, using JSON.parse(yourJSONString) to transform your json string to json object.

Views and downloads count - Update database on view with lightbox and download

I've made a site with laravel and have a page where there are pictures that can be seen in hi-resolution via fancybox or downloaded. In the database i have counters for each action. and I do already have GET routes set up for the counting since they are used in other situations too.
for example: www.mysiste.com/somecode/someothercode/image/viewed
the simplified structure of each image is this.. This is called inside a for each loop.. i removed all styling and classes for better reading...
<div >
<div class="card" style="background-color: lightgray">
<div >
<a data-fancybox="gallery" href="/images/......../{{$photo->filename}}">
<img class="card-img" src="/images/......../thumb/thumb_{{$photo->filename}}">
</a>
</div>
<div class="card-footer">
<div>
<div>
<a download="{{$photo->filename}}" href="/images/......../{{$photo->filename}}">
<span>Download (Hi-Res)</span>
</a>
</div>
<div>
<a download="social_{{$photo->filename}}" href="/images/......../social_{{$photo->filename}}">
<span>Download (Social-Res)</span>
</a>
</div>
</div>
</div>
</div>
</div>
I would need that when they hit the download button it calls a certain URL in the background for upcounting.. (most important)
If possible I would like to hit another URL when the images are viewed fullscreen through fancybox.
how can this be done?
You can do something in the lines of:
<a data-fancybox="gallery" href="{{ route('photo.fancybox', ['photo' => $photo])}}">
<img class="card-img" src="/images/......../thumb/thumb_{{$photo->filename}}">
</a>
...
<a href="{{ route('photo.download', ['photo' => $photo])}}">
<span>Download (Hi-Res)</span>
</a>
PhotoController
public function download(Photo $photo){
$photo->downloadCount->increment();
return redirect('/images/......../'. $photo->filename);
}
public function fancybox(Photo $photo){
$photo->fancyboxCount->increment();
return redirect('/images/......../social_'. $photo->filename);
}
And make sure to register your new routes accordingly:
Route::get('photo/download', 'PhotoController#download')->name('photo.download');
Route::get('photo/fancybox', 'PhotoController#fancybox')->name('photo.fancybox');

Display results of many-to-many relationships and separate results regardless of their id

How do you display results of many to many relationships and separate results regardless of their id?
#forelse ( $papers as $paper )
<article class="article-feeds mb-4">
#foreach ($paper->activityTypes as $actType )
<div class="flex ml-4" id="activitiesInformation">
<div class="flex-1">
<div>
<p class="font-bold">{{ $actType->activity_type }}</p> for {{ $paper->title }}
</div>
</div>
</div>
#endforeach
</article>
#empty
<p class="text-xl font-display">You don't have any activities listed for you</p>
</div>
#endforelse
I have a blade file that displays paper's activities, but what I need is to display each of them like in a separate activity feed, regardless of their id, as they are grouped by their paper_id key, I want it to be separated
For this example, I want to see
Recommendation for Expedita sit.
Publish Paper for Expedita sit.
to be separated from one another since they are different activity but they have the same paper id..
Furthermre,,
this is the activityTypes relationship, I'm talking about
/*success here.*/
public function activityTypes()
{
return $this->belongsToMany(ActivityType::class,
'paper_activities',
'paper_id',
'activity_type_id')
->withPivot('creator_id','display_name','body','status')
->withTimestamps() ;
}
I hope I get your idea. What you want is to get all the activity types related to a paper and each activity type on its own card.
To achieve that, from your Controller you can pass a new variable called $activity_types that you will fill like this:
//assuming you are returning it from the index method
public function index()
{
$papers = Paper::all();
$activity_types = $papers->flatMap->activityTypes;
return view('papers.index')
->with('activity_types', $activity_types);
}
also your blade should look something like this
#forelse ( $activity_types as $activity_type )
<article class="article-feeds mb-4">
<div class="flex ml-4" id="activitiesInformation">
<div class="flex-1">
<div>
<p class="font-bold">{{ $activity_type->activity_type }}</p> for {{ $activity_type->paper->title }}
</div>
</div>
</div>
</article>
#empty
<p class="text-xl font-display">You don't have any activities listed for you</p>
#endforelse
Make sure you have a relation to Paper from the ActivityType model.

laravel 5.4 undefined variable in view

I'm kind of new to laravel and trying to pull data from a database but keep hitting an error page saying there's an undefined variable within the view.
I'm supposing there's something I'm doing wrong (or not doing) within the controller. So I have a create.blade.php that posts data from a form to the database and everything works fine, however I want it such that after posting to the database to redirect to the show.blade.php showing the uploaded data and here is where I hit a brick wall with the error messages.
This is my store function within the controller -
public function store(Request $request)
{
$data4page = new Data4page;
$data4page->h1Ttle = $request->h1Ttle;
$data4page->h4Ttle = $request->h4Ttle;
$data4page->description = $request->description;
$data4page->save();
/*redirecting to the content's show page*/
return redirect()->route('content.show', $data4page->id);
}
And this is the show function within the same controller -
public function show($id)
{
//
$data4page = Data4page::find($id);
return view('digital.show')->with(compact('data4page'));
}
The error message I'm getting is -
Undefined variable: data4page (View: /var/www/html/theproject/resources/views/content/show.blade.php)
And in the show.blade.php this is a sample of what I have -
<h1>{{ $data4page->h4Ttle }}</h1>
<p>{{ $data4page->description }}</p>
<h4>{{ $data4page->h4Ttle }}</h4>
Having said all that, I have also tried various means of returning the view within the show function of the controller but all these result in the same error message above. These variants include -
return view('content.show')->with('data4page', $data4page);
return view('content.show',['data4page'=>$data4page]);
Update: I earlier had typos but now the error I get is -
undefined variable: {"id":9,"h1Ttle":"h1 sample text","h4Ttle":"h4 sample text","description":"body text goes here"} (View: /var/www/html/theproject/resources/views/content/show.blade.‌​‌​php)
This is the show.blade.php -
#extends('main')
#section('title')
#section('content')
<div class="app-template">
<main class="wrapperMain">
<div class="">
<aside class="navSidebar">
<nav class="navProperty">
<h1 class="navProperty-title">{{ $data4page->h1Ttle }}</h1>
</nav>
<footer class="footerProperty">
<div class="upcomingSchedule">
<h4 class="upcomingSchedule-heading">{{ $data4page->h4Ttle }}</h4>
</div>
</footer>
</aside>
</div>
<div class="content content--withSidebar">
<div class="lead--Home">
<p>{{ $data4page->description }}</p>
</div>
</div>
</main>
#endsection
You have a name mismatch.
return view('content.show')->with(['name' => $data4page]);
Here you should use:
<h1>{{ $name->h4Ttle }}</h1>
As you called it name
In your other options you defined Data4page and in your view you use data4page (lower case d).
Changed this
return view('content.show')->with(['name' => $data4page]);
To:-
return view('content.show')->with(compact('data4page'));
Hope it hepls!
Why have you resorted to typing the variable name with the wrong case when the answers given below are absolutely fine? PHP variables are case sensitive. You're passing $Data4page to your view in the code you've shown and then trying to use the access $data4page. Any of the below will work.
return view('content.show', ['data4page' => $data4page]);
return view('content.show', compact('data4page'));
return view('content.show')->with('data4page', $data4page);
return view('content.show')->with(['data4page' => $data4page]);
return view('content.show')->with(compact('data4page'));
You need to loop through the collection to get the value
#section('content')
<div class="app-template">
<main class="wrapperMain">
#foreach ($data4page as $d4p)
<div class="">
<aside class="navSidebar">
<nav class="navProperty">
<h1 class="navProperty-title">{{ $d4p->h1Ttle }}</h1>
</nav>
<footer class="footerProperty">
<div class="upcomingSchedule">
<h4 class="upcomingSchedule-heading">{{ $d4p->h4Ttle }}</h4>
</div>
</footer>
</aside>
</div>
<div class="content content--withSidebar">
<div class="lead--Home">
<p>{{ $d4p->description }}</p>
</div>
</div>
#endforeach
</main>
#endsection

Laravel 4.2 Help Needed

I have this piece of code in my HomeController.php which is within the public function home() block
//Fetch Users Online
$online = DB::table('users')->where('online','1')->get();
//Get All Users Online Count
$num_online = DB::table('users')->where('online','1')->count();
//Get All ADMIN Online Count
$admin_online = DB::table('users')->where('online','1')->where('group_id','4')->count();
//Get All MODS Online Count
$mod_online = DB::table('users')->where('online','1')->where('group_id','6')->count();
//Get All VIP Online Count
$vip_online = DB::table('users')->where('online','1')->where('group_id','8')->count();
//Get All UPLOADER Online Count
$uploader_online = DB::table('users')->where('online','1')->where('group_id','7')->count();
//Get All MEMBERS Online Count
$member_online = DB::table('users')->where('online','1')->where('group_id','3')->count();
which is relayed in the home.blade.php here
<div class="col-md-10 col-sm-10 col-md-offset-1">
<div class="clearfix visible-sm-block"></div>
<div class="panel panel-default">
<div class="panel-heading"><h4>Online Users <span class="badge">{{ $num_online }}</span></h4></div>
<div class="panel-body">
#foreach($online as $o)
<span class="badge-user group-member">
{{ $o->username }}
</span>
#endforeach
</div>
<div class="panel-footer">
<div class="row">
<div class="col-sm-12">
<span class="badge-user group-member">Member ({{ $member_online }})</span> <span class="badge-user group-uploader">Uploader ({{ $uploader_online }})</span> <span class="badge-user group-vip">VIP ({{ $vip_online }})</span> <span class="badge-user group-staff">Mod ({{ $mod_online }})</span> <span class="badge-user group-su">Admin ({{ $admin_online }})</span>
</div>
</div>
</div>
</div>
</div>
<!-- /Online Users -->
My question is in my users table in my DB i have the online column called online. 0 is offline and 1 is online. If a manually update a users Online status from a zero to a one then they show up in the ONLINE block shown above as they should. But how can I automate this? If a user logs in its set to 1 and if they logout its set to 0.
any help would be appreciated.....
Im running laravel 4.2 and guessing this would be easier to accomplish in 5.4
Im dreading upgrading and don't even want to attempt it on my own.
You could achieve that by creating and listening to events.
Event::listen('auth.login', function($user)
{
$user->online = 1;
$user->save();
});
Event::listen('auth.logout', function($user)
{
$user->online = 0;
$user->save();
});
Please follow laravel documentation for detailed information
You can check at the user sessions, when you use the database driver for sessions there will be a column called last_activity, if the user hasn't done anything in 15 mins you know it is offline.
You can't depend on if a user logs out. Not everyone does that every time.

Resources