Method App\Http\Controllers\CommunityController::show does not exist
My route
Route::get('/community/{id}', [CommunityController::class, 'community'])
->name('profile.community');
Controller
public function community($id)
{
$communityProfile = Community::find($id);
/* $join = CommunityUser::join('communities', 'communities.user_id', '=', 'community_users.user_id')->get(); */
return view('user.comprofile', compact('communityProfile', 'join'));
}
View community
#for ($i = 0; $i < 3; $i++)
<a href=" {{ route('profile.community', $communities[$i]->id) }} ">
<div class="w-full p-6 overflow-hidden bg-white border hover:bg-gray-50 border-gray-200 rounded-lg shadow-md dark:bg-gray-800 dark:border-gray-700">
<h5 class="mb-2 text-2xl font-semibold tracking-tight text-gray-900 dark:text-white">{{$communities[$i]->community}}</h5>
<p class="mb-3 font-normal text-gray-500 dark:text-gray-400 flex gap-3">
<x-iconsax-out-location class="text-[#F15E4A] w-5"/> {{$communities[$i]->address}}, {{$communities[$i]->city}}
</p>
<div class="flex gap-2">
<a href="#" class="inline-flex items-center font-semibold text-[#F15E4A] hover:underline cursor-default">
{{ $communities[$i]->type }}
</a>
#if ($communities[$i]->user_id === Auth::user()->id)
<span class="text-sm text-gray-500 pt-1">{{__('Created by: ')}}</span>
{{Auth::user()->name}}
#else
<span class="text-sm text-gray-500 pt-1">{{__('Created by: ')}}</span>
{{ $communities[$i]->name }}
#endif
</div>
</div>
</a>
#endfor
I am trying to view the community created by users but it gives me "cannot find a Controller Method ".
This can have several causes. Therefore, here is a small checklist:
The controller path is missing from your route:
use App\Http\Controllers\CommunityController; // this line
Route::get('/community/{id}', [CommunityController::class, 'community'])->name('profile.community');
Your CommunityController class name is misspelled
The namespace of the CommunityController is wrong
And then just to be sure, run: php artisan route:clear.
Related
when i run laravel project on my computer after doing php artisan serve as soon as it login it shows error "Attempt to read property "menus" on null"
Please help me
#foreach ($specials->menus as $menu)
<div class="max-w-xs mx-4 mb-2 rounded-lg shadow-lg">
<img class="w-full h-48" src="{{ Storage::url($menu->image) }}" alt="Image" />
<div class="px-6 py-4">
<h4 class="mb-3 text-xl font-semibold tracking-tight text-green-600 uppercase">
{{ $menu->name }}</h4>
<p class="leading-normal text-gray-700">{{ $menu->description }}.</p>
</div>
<div class="flex items-center justify-between p-4">
<span class="text-xl text-green-600">${{ $menu->price }}</span>
</div>
</div>
#endforeach
welcomecontroller.php
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
class Menu extends Model
{
use HasFactory;
protected $fillable = ['name', 'price', 'description', 'image'];
public function categories()
{
return $this->belongsToMany(Category::class, 'category_menu');
}
}
I suppose you forgot to initialize $specials, it is null, that's why you get the error.
Could you try to use dd before foreach statement, so we can see it's content?
{{ dd($specials) }}
UPDATE:
#if(!is_null($specials))
#foreach ($specials->menus as $menu)
<div class="max-w-xs mx-4 mb-2 rounded-lg shadow-lg">
<img class="w-full h-48" src="{{ Storage::url($menu->image) }}" alt="Image" />
<div class="px-6 py-4">
<h4 class="mb-3 text-xl font-semibold tracking-tight text-green-600 uppercase">
{{ $menu->name }}</h4>
<p class="leading-normal text-gray-700">{{ $menu->description }}.</p>
</div>
<div class="flex items-center justify-between p-4">
<span class="text-xl text-green-600">${{ $menu->price }}</span>
</div>
</div>
#endforeach
#else
<div>no item was found</div>
#endif
Your issue is with this line of code (from the comments):
$specials = Category::where('name', 'specials')->first();
->first(); can return null, so when you use it later as $specials->menus, it can be null->menus, which is not valid.
You can use ->firstOrFail() to trigger a 404 in the event $specials results in null, or #foreach($specials->menus ?? [] as $menu) to short-circuit your foreach() with an empty array if $specials is null:
In your Controller:
$specials = Category::where('name', 'specials')->firstOrFail();
return view('welcome', compact('specials'));
OR
In your View:
#foreach($specials->menus ?? [] as $menu)
...
#endforeach
Either case will properly handle your "unsafe" code (unsafe meaning functional, but possible for unhandled errors, like null->menus, etc.) and either trigger a 404 before the view is rendered, or perform a foreach() on an empty array, which does nothing.
I'm trying to figure out what the problem is. So, I use laravel blade templating for navbar section and I want to add route to my anchor (A href tag). After I put the route to the anchor and try to click on it, it doesn't redirect me to the page I mean. Console says:
Uncaught DOMException: Failed to execute 'querySelector' on 'Document': 'http://127.0.0.1:8000/about' is not a valid selector.
at HTMLAnchorElement.<anonymous> (http://127.0.0.1:8000/:1813:26)
(anonymous) # (index):1813
Why does this happen?
To help you answer this question, I add some code here.
navbar.blade.php (search for 'the problem is here')
<div class=" ud-header bg-transparent absolute top-0 left-0 z-40 w-full flex items-center">
<div class="container">
<div class="flex -mx-4 items-center justify-between relative">
<div class="px-4 w-60 max-w-full">
<a href="index.html" class="navbar-logo w-full block py-5">
<img src="{{ asset('images/logo/logo-white.svg') }}" alt="logo" class="w-full header-logo"/>
</a>
</div>
<div class="flex px-4 justify-between items-center w-full">
<div>
<button id="navbarToggler" class=" block absolute right-4 top-1/2 -translate-y-1/2 lg:hidden focus:ring-2 ring-primary px-3 py-[6px] rounded-lg">
<span class="relative w-[30px] h-[2px] my-[6px] block bg-white"></span>
<span class="relative w-[30px] h-[2px] my-[6px] block bg-white"></span>
<span class="relative w-[30px] h-[2px] my-[6px] block bg-white"></span>
</button>
<div id="navbarCollapse" class=" absolute py-5 lg:py-0 lg:px-4 xl:px-6 bg-white lg:bg-transparent shadow-lg rounded-lg max-w-[250px] w-full lg:max-w-full lg:w-full right-4 top-full hidden lg:block lg:static lg:shadow-none " >
<ul class="blcok lg:flex">
<li class="relative group">
<a href="#" class=" ud-menu-scroll text-base text-dark lg:text-white lg:group-hover:opacity-70 lg:group-hover:text-white group-hover:text-primary py-2 lg:py-6 lg:inline-flex lg:px-0 flex mx-8 lg:mr-0 " > Beranda </a>
</li>
<li class="relative group">
{{-- the problem is here --}}
<a href="{{ route('about') }}" class=" ud-menu-scroll text-base text-dark lg:text-white lg:group-hover:opacity-70 lg:group-hover:text-white group-hover:text-primary py-2 lg:py-6 lg:inline-flex lg:px-0 flex mx-8 lg:mr-0 lg:ml-7 xl:ml-12 " > Tentang </a>
</li>
<li class="relative group submenu-item">
<a href="javascript:void(0)" class=" text-base text-dark lg:text-white lg:group-hover:opacity-70 lg:group-hover:text-white group-hover:text-primary py-2 lg:py-6 lg:inline-flex lg:pl-0 lg:pr-4 flex mx-8 lg:mr-0 lg:ml-8 xl:ml-12 relative after:absolute after:w-2 after:h-2 after:border-b-2 after:border-r-2 after:border-current after:rotate-45 lg:after:right-0 after:right-1 after:top-1/2 after:-translate-y-1/2 after:mt-[-2px] " > Layanan Kami </a>
<div class=" submenu hidden relative lg:absolute w-[250px] top-full lg:top-[110%] left-0 rounded-sm lg:shadow-lg p-4 lg:block lg:opacity-0 lg:invisible group-hover:opacity-100 lg:group-hover:visible lg:group-hover:top-full bg-white transition-[top] duration-300 " >
<a href="about.html" class=" block text-sm text-body-color rounded hover:text-primary py-[10px] px-4 " > Transfer Antar Bank </a>
<a href="about.html" class=" block text-sm text-body-color rounded hover:text-primary py-[10px] px-4 " > Bayar Virtual Account </a>
<a href="pricing.html" class=" block text-sm text-body-color rounded hover:text-primary py-[10px] px-4 " > Isi Pulsa & Kuota </a>
<a href="blog-grids.html" class=" block text-sm text-body-color rounded hover:text-primary py-[10px] px-4 " > Lisensi Digital </a>
<a href="blog-details.html" class=" block text-sm text-body-color rounded hover:text-primary py-[10px] px-4 " > Langganan Berbayar </a>
<a href="signup.html" class=" block text-sm text-body-color rounded hover:text-primary py-[10px] px-4 " > Jasa Sosial Media </a>
</a>
</div>
</li>
<li class="relative group">
<a href="#contact" class=" ud-menu-scroll text-base text-dark lg:text-white lg:group-hover:opacity-70 lg:group-hover:text-white group-hover:text-primary py-2 lg:py-6 lg:inline-flex lg:px-0 flex mx-8 lg:mr-0 lg:ml-7 xl:ml-12 " > Kontak Kami </a>
</li>
</ul>
</div>
</div>
<div class="sm:flex justify-end hidden pr-16 lg:pr-0">
<a href="signin.html" class=" text-base font-medium text-white hover:opacity-70 py-3 px-7 loginBtn " > Masuk </a>
<a href="signup.html" class=" text-base font-medium text-white bg-white bg-opacity-20 rounded-lg py-3 px-6 hover:bg-opacity-100 hover:text-dark signUpBtn duration-300 ease-in-out " > Daftar </a>
</div>
</div>
</div>
</div>
IndexController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Http\Requests;
use App\Http\Controllers\Controller;
class indexController extends Controller
{
public function about()
{
return view('about');
}
}
web.php
<?PHP
use App\Http\Controllers\indexController;
use Illuminate\Support\Facades\Route;
use Illuminate\Support\Facades\View;
Route::get('/', function () {
return view('index');
});
Route::get('/about',[IndexController::class,'about'])->name('about');
main.blade.php
<html lang="id" class="scroll-smooth">
<title>#yield('title','PayTime - Merge All Payments')</title>
{{-- header place --}}
#include('layouts.head')
<body>
{{-- navbar place --}}
#include('layouts.navbar')
#yield('content')
{{-- faq place --}}
#include('layouts.faq')
{{-- footer place --}}
#include('layouts.footer')
{{-- scripting place --}}
<script src="{{ asset('js/main.js') }}"></script>
<script>
// ==== for menu scroll
const pageLink = document.querySelectorAll(".ud-menu-scroll");
pageLink.forEach((elem) => {
elem.addEventListener("click", (e) => {
e.preventDefault();
document.querySelector(elem.getAttribute("href")).scrollIntoView({
behavior: "smooth",
offsetTop: 1 - 60,
});
});
});
// section menu active
function onScroll(event) {
const sections = document.querySelectorAll(".ud-menu-scroll");
const scrollPos =
window.pageYOffset ||
document.documentElement.scrollTop ||
document.body.scrollTop;
for (let i = 0; i < sections.length; i++) {
const currLink = sections[i];
const val = currLink.getAttribute("href");
const refElement = document.querySelector(val);
const scrollTopMinus = scrollPos + 73;
if (
refElement.offsetTop <= scrollTopMinus &&
refElement.offsetTop + refElement.offsetHeight > scrollTopMinus
) {
document
.querySelector(".ud-menu-scroll")
.classList.remove("active");
currLink.classList.add("active");
} else {
currLink.classList.remove("active");
}
}
}
window.document.addEventListener("scroll", onScroll);
</script>
</body>
user_id doesn't have a default value that's is the error I'm getting when I clicked on the clone button and also user_id is fillable livewire movie show components
public function clone(Movie $movie)
{
$cloneMovie = $movie->replicate();
$cloneMovie->cloned_movie_id = $movie->id;
$cloneMovie->save();
}
livewire movie show blade view
<div>
<div class="">
<div class="p-1 bg-white rounded-md">
<div class="flex justify-between p-2 mb-2 text-white bg-gray-400 rounded-md">
<h3 class="font-bold text-white text-md">{{ $movie->title }}</h3>
<span class="text-xs">100 views</span>
</div>
<img src="{{ asset('/assets/images/blog/img-1.jpg') }}" alt="" class="w-auto rounded-md">
<p class="p-2">{{ $movie->body }}</p>
<button wire:click="clone({{ $movie->id }})">clone</button>
</div>
</div>
</div>
$cloneMovie->push();
Is what you’re looking for.
I have a pivot table that links my products and categories together. What I'm trying to do is in my edit page for a product I
have a list of all the categories and each category has a toggle button that will enable or disable that category for that product.
The problem I'm having is that all my categories is set to enabled, but I only have one enabled and the rest is supposed to be disabled
I'm using laravel 8 and livewire
Here is my code
namespace App\Http\Livewire\Products;
use App\Models\Product;
use Livewire\Component;
use App\Models\Category;
class Edit extends Component
{
public Product $product;
public bool $enabled;
public $name;
public $description;
public function mount()
{
$pcPivot = $this->product->categories()->where('product_id', $this->product->id)->exists();
if($pcPivot === true)
{
$this->enabled = true;
}else{
$this->enabled = false;
}
$this->name = $this->product->name;
$this->description = $this->product->description;
}
public function render()
{
$categories = Category::all();
return view('livewire.products.edit', [
'categories' => $categories,
]);
}
}
and here is my edit.blade.php
<div>
<div class="md:grid md:grid-cols-3 md:gap-6">
<div class="md:col-span-1">
<div class="px-4 sm:px-0">
<h3 class="text-lg font-medium leading-6 text-gray-900">Edit Product</h3>
</div>
</div>
<div class="mt-5 md:mt-0 md:col-span-2">
<div class="shadow sm:rounded-md sm:overflow-hidden">
<form wire:submit.prevent="submit">
<div class="px-4 py-5 bg-white sm:p-6">
<div class="grid grid-cols-3 gap-6">
<div class="col-span-3 sm:col-span-2">
<label for="title" class="block text-sm font-medium leading-5 text-gray-700">
Name
</label>
<div class="rounded-md shadow-sm">
<input id="name" wire:model="product.name" class="flex-1 form-input block w-full min-w-0 transition duration-150 ease-in-out sm:text-sm sm:leading-5">
</div>
</div>
</div>
</div>
<div class="px-4 py-5 bg-white sm:p-6">
<div class="grid grid-cols-3 gap-6">
<div class="col-span-3 sm:col-span-2">
<label for="description" class="block text-sm font-medium leading-5 text-gray-700">
Description
</label>
<div class="rounded-md shadow-sm">
<textarea id="description" wire:model="product.description" rows="3" class="form-textarea mt-1 block w-full transition duration-150 ease-in-out sm:text-sm sm:leading-5"></textarea>
</div>
</div>
</div>
</div>
<div class="px-4 py-3 bg-gray-50 text-right sm:px-6">
<span class="inline-flex rounded-md shadow-sm">
<button type="submit" class="inline-flex justify-center py-2 px-4 border border-transparent text-sm leading-5 font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-500 focus:outline-none focus:border-indigo-700 focus:shadow-outline-indigo active:bg-indigo-700 transition duration-150 ease-in-out">
Update
</button>
</span>
</div>
</form>
</div>
</div>
</div>
#include('spacer')
<div class="md:grid md:grid-cols-3 md:gap-6">
<div class="md:col-span-1">
<div class="px-4 sm:px-0">
<h3 class="text-lg font-medium leading-6 text-gray-900">Categories</h3>
</div>
</div>
<div class="mt-5 md:mt-0 md:col-span-2">
<div class="shadow sm:rounded-md sm:overflow-hidden">
<table class="min-w-full divide-y divide-gray-200">
<thead>
<tr>
<x-th>Title</x-th>
<x-th>Enable/Disable</x-th>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-200">
#foreach($categories as $category)
<tr>
<td class="px-6 py-4 whitespace-no-wrap">
<div class="flex items-center">
<div class="text-sm font-medium text-gray-900">
{{ $category->title }}
</div>
</div>
</td>
<td class="px-6 py-4 whitespace-no-wrap">
<div class="mt-1 flex rounded-md">
<span role="checkbox" tabindex="0" aria-checked="false" class="#if($enabled) bg-indigo-600 #else bg-gray-200 #endif relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:shadow-outline">
<span aria-hidden="true" class="#if($enabled) translate-x-5 #else translate-x-0 #endif inline-block h-5 w-5 rounded-full bg-white shadow transform transition ease-in-out duration-200">
<input id="enabled" type="checkbox" wire:model="enabled" class="invisible">
</span>
</span>
</div>
</td>
</tr>
#endforeach
</tbody>
</table>
</div>
</div>
</div>
</div>
If you check the documentation for Livewire, at lifecycle hooks... you will see that:
mount : Runs once, immediately after the component is instantiated, but before render() is called
So basically you are getting an "enabled" value once, before rendering the component,then you start rendering it, with that foreach, using the same "enabled" from mount for each item of your dataset.
Consider building your cursor with the enabled value inside for each record.
I need help or suggestion in highlighting / toggling a class and displaying data I'm just using blade/server-side in passing props, so from this in blade
<chat-app :respondent="{{ $user[0]->respondent }}" :user="{{ auth()->user() }}"></chat-app>```
then inside the ChatApp.vue file
<message-inbox :contact="respondent" :messages="messages"></message-inbox>
the contact prop there contains the user object that we'll send the chat to... including his id and display name and other basic details..
now I want to fetch all the messages but also highlighting that specific respondent's message.
<li class="bg-blue flex flex-no-wrap items-center text-black cursor-pointer p-3">
<img class="flex justify-center items-center flex-no-shrink w-12 h-12 bg-grey rounded-full font-semibold text-xl text-white mr-3" :src="userAvatar" alt="">
<div class="flex-1 min-w-0">
<div class="flex justify-between mb-1">
<h2 class="font-semibold text-sm">
<i class="fas fa-users fa-fw"></i> {{ conversation.respondent }}
</h2>
<span class="text-sm">
<i class="fas fa-check fa-fw"></i>
10:00
</span>
</div>
<div class="text-sm truncate">
<span>
Some latest messages from this conversation.
</span>
</div>
</div>
</li>
props : {
contact : {
type : Object,
default : null
},
messages : {
type : Array,
default : []
},
}
I think you should do the following to highlight the mentioned respondent.
Change your li tag as below code:
<li class="bg-blue flex flex-no-wrap items-center text-black cursor-pointer p-3" :class="{'highlight': conversation.respondent == respondent}">
<img class="flex justify-center items-center flex-no-shrink w-12 h-12 bg-grey rounded-full font-semibold text-xl text-white mr-3" :src="userAvatar" alt="">
<div class="flex-1 min-w-0">
<div class="flex justify-between mb-1">
<h2 class="font-semibold text-sm">
<i class="fas fa-users fa-fw"></i> {{ conversation.respondent }}
</h2>
<span class="text-sm">
<i class="fas fa-check fa-fw"></i>
10:00
</span>
</div>
<div class="text-sm truncate">
<span>
Some latest messages from this conversation.
</span>
</div>
</div>
</li>
Add highlight class in your CSS part as below:
.highlight {
color: yellow;
}