如何在選擇選項中過濾數據並將其顯示為報告（php：laravel框架）

Question

如何在選擇選項中過濾數據並將其作為報告顯示在另一個表中。 我不知道如何使用JavaScript。

以下是我的report.blade.php

<table width="100%">
    <div id="DrpDwn" align="center">
        <h1> report</h1> <br/>
        Programme:<select id="program">
            @foreach($profiles as $profile)
                <option>{{$profile->program}}</option>
            @endforeach
        </select><br>
        Faculty:<select id="faculty">
            @foreach($profiles as $profile)
                <option> {{$profile->faculty}}</option>
            @endforeach
        </select>
    </div>
    <br />
    <table id="tableID" border="2" width="100%">
        <tr>
            <td class="student_id" width="15%">Student id </td>
            <td class="name" width="30%">name</td>
            <td class="program" width="30%"> Program</td>
            <td class="faculty" width="25%">Faculty </td>
        </tr>
        @foreach($profiles as $profile)
        <tr>
            <td class="student_id" width="15%">{{$profile->student_id }}</td>
            <td class="name" width="30%">{{$profile->student_name }}</td>
            <td class="program" width="30%"> {{$profile->program }}</td>
            <td class="faculty" width="25%">{{$profile->faculty }} </td>
        </tr>
        @endforeach
    </table>
    </table>

我想要這樣..當我單擊程序：文憑多媒體時，它將僅顯示與之相關的數據。 （對不起，我的英語不好）

Answer 1

首先：您應該在控制器中創建一個函數，該函數返回所有表行以及數據庫中的數據：

function getTableRows($faculty)
{
$rows = Student:::where('faculty', '=', $faculty)
foreach ($rows as $row)
{

echo "<tr><td>".$row->student_id."</td><td>".$row->name."</td><td>".$row->faculty."</td></tr>";
}
}

然后您將在laravel中的route.PHP中為此函數創建路由，並在select的onchange事件中使用ajax調用此函數：

 $(document).ready(function() { 

$("#faculty").change(function() { 
     //your route
     $.get("student/getTableRows/"+$(this).val(), function(html) { 
         // append the "ajax'd" data to the table body 
         $("#tableID tbody").append(html); 

    }); 

}); 
});

另外，您應該使用ajax表行或動態ajax表，jquery ajax表。

Answer 2

<select id = 'program'>      </select>
<div id = 'tableID'></div>

現在在您的JavaScript頁面中

$("#program").bind("change", function() {
    $.ajax({
        type: "GET", 
        url: "path/to/server/script.php",
        data: "id="+$("#program").val(),
        success: function(html) {
            $("#tableID").html(html);
        }
    });
    });