Loading correct details of a listing on a new page

  html, laravel, laravel-blade, php

I am fairly new to Laravel, hence I don’t know that many "Laravel-terms" and stuff, so it is a bit hard to search for what I mean, however I hope it is understandable what my issue is.

But I got a website which displays different listings of Jobs, like so:

https://i.stack.imgur.com/Cz7ql.jpg

As you can see on the right side there are 2 buttons, the upper one is for "apply now" and the lower one for "details" (details about the job), when the user clicks for instance on the "details" button a new view loads with the details about the job

Now my question is, is it possible to display the correct details automatically when a user clicks on the details button?
How can I implement that laravel shows the details that match the listing?

Here is my blade code that outputs the listings:

@extends('layouts.app')

@section('content')
    <style>
        .container {
            display: flex;
            justify-content: center;
            align-items: center;
        }
    </style>
    <div class="flex justify-center">
        <div class=" w-11/12 bg-gray-400 p-6 rounded-lg font-serif text-4xl font-bold bg-opacity-70 subpixel-antialiased tracking-wide not-italic">
            <h1 class="flex justify-center mb-10"> Übersicht der Stellenanzeigen </h1>

            @if ($posts->count())
                @foreach($posts as $post)
                    <div class="p-10 grid-cols-3 grid-rows-3 gap-4 shadow-2xl mb-10 bg-gradient-to-r from-green-400 to-blue-500 border-solid border-2 border-black rounded-lg">
                        <!--Card 1-->
                        <div class="overflow-hidden row-span-3 bg-gray-100 shadow-2xl border-solid border-2 border-gray-500 rounded-lg">
                            <div class="pt-2 pl-6 mt-3"> {{ $post->Titel }}</div>
                            <div class="px-6 py-4 mt-2 ring-4 ring-opacity-90">
                                <button type="submit" class="text-white px-4 py-3 rounded text-base font-medium
                                bg-gradient-to-r from-green-400 to-blue-500 float-right shadow transition
                                duration-500 ease-in-out transform hover:-translate-y-1 hover:scale-100" onclick="window.location=' {{ url('bewerben') }}'">Direkt bewerben!</button>


                                <div class="pt-2 pl-4 font-medium text-base font-bold font-serif"> Standort: {{ $post->Standort }}</div>

                                <div class="pt-2 pl-4 font-medium text-base font-bold font-serif"> Kontakt: {{ $post->Kontakt }}</div>
                                <button type="submit" class="text-white px-4 py-3 rounded text-base font-medium
                                bg-gradient-to-r from-green-400 to-blue-500 float-right shadow transition duration-500 ease-in-out transform hover:-translate-y-1 hover:scale-100">Details!</button>
                                <div class="pt-2 pl-4 font-medium text-base font-bold font-serif"> Startdatum: {{ $post->startdate }}</div>
                                <div class="pt-2 pl-4 font-medium text-base font-bold font-serif"> Enddatum: {{ $post->enddate }}</div>


                                <div class="px-6 pt-4 pb-2"> </div>
                            </div>

                        </div>
                    </div>
                        @endforeach

                        @endif
                    </div>

        </div>

@endsection

I thought about ways to implement it theoretically, and came up with two that at least sound kind of logic to me that MAY work:

  1. I have to somehow "save" the ID of the listing so that when a user clicks on the button of the third listing the details are displayed on the next view that are from the listing in the database with the same ID as the third listing.

  2. I could use the title of the listing to search the details of a DB entry with the same title, however I think that’s a bit stupid to say the least because then every title has to be unique.

Any food for though appreciated!

Source: Laravel

Leave a Reply