在新页面上加载列表的正确详细信息

Question

我是 Laravel 的新手，所以我不知道那么多“Laravel-terms”之类的东西，所以搜索我的意思有点困难，但我希望我的问题是可以理解的。

但是我有一个显示不同工作列表的网站，如下所示：

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

正如您在右侧看到的那样，有 2 个按钮，上面的按钮用于“立即申请”，下面的按钮用于“详细信息”（有关工作的详细信息），例如，当用户点击“详细信息”按钮，一个新视图加载了有关工作的详细信息

现在我的问题是，是否可以在用户点击详细信息按钮时自动显示正确的详细信息？我如何实现 laravel 显示与列表匹配的详细信息？

这是我的 blade 输出列表的代码：

@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

我考虑了从理论上实现它的方法，并想出了两个对我来说至少听起来可能可行的逻辑：

我必须以某种方式“保存”列表的 ID，以便当用户单击第三个列表的按钮时，详细信息将显示在来自列表中的列表的下一个视图中与第三个列表具有相同 ID 的数据库。
我可以使用列表的标题来搜索具有相同标题的数据库条目的详细信息，但是我认为至少可以说这有点愚蠢，因为这样每个标题都必须是唯一的.

感谢任何食物！

编辑：我的问题被禁止了，因为我的问题没有被投票，但得到了回答，并且评论中进行了一些很好的讨论。但是堆栈交换团队告诉我编辑我的问题以使它们更清楚，但他们收到了答案，所以我认为它们很清楚。我不是母语人士，所以我的英语不是最好的，我不能很好地表达自己。但是他们告诉我编辑它们，使它们看起来像新的并且可以被投票。我不明白为什么这有道理，但如果我得到一些赞成票，它可能会解除我的问题禁令，所以如果你不介意的话，也许可以投票。

Answer 1

您可以使用 AJAX 获取此按钮的 detail.instead 您可以将标签用作按钮。

<button type="" 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>

<a type="button" 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="get_detail('{{$post->id}}'">

在“get_detail”函数中传递您的特定作业的 ID。然后你可以很容易地使用这个id通过AJAX

获取数据

在新页面上加载列表的正确详细信息

Loading correct details of a listing on a new page

html

php

laravel

laravel-blade