如何将 ajax 响应数据显示到 foreach 循环内的 php 变量中

Question

>我有一个视图，其中一些数据显示在带有过滤选项的表中。当我从过滤部分选择下拉菜单选项时，我希望只有表格部分将被刷新并显示更新的数据。我已经使用 ajax 成功地从数据库中过滤了数据。但无法在表中显示筛选后的数据(ajax 响应(。

视图的筛选和表部分.php

<div class="col-lg-8">
    <div class="panel panel-primary">
        <div class="panel-heading">
            <h3 class="panel-title"> Search </h3>
        </div>
        <div class="panel-body">
            <div class=" col-md-5">
                <select class="form-control selectpicker searchField" id="selectTitleId_search">
                    <option value="">Select Title</option>
                    @foreach($titleData as $value)
                        <option value="{{$value->id}}">{{$value->name}}</option>
                    @endforeach
                </select>
            </div>
            <div class="col-md-5">
                <input type="text" id="datepicker" class="form-control searchField" placeholder="Select date">
                <span class="add-on"><i class="icon-th"></i></span>
            </div>  
            <div class="col-md-2">
                <button type="button" class="btn btn-info" id="searchButton">
                    Search
                </button>
            </div>      
        </div>
    </div>
</div>
<br/>
<div class="col-lg-9">
    <div class="panel panel-info" >
        <div class="panel-heading" style="padding:5px" >
            <div class="panel-title">
                <h3> Daily Income Report</h3>                   
            </div>  
        </div>
        <div class="panel-body" id="report">
            <table class="table table-striped">
                <thead>
                    <tr>
                        <th>Title Name</th>
                        <th>Amount</th>
                        <th>Date & Time</th>
                    </tr>                       
                </thead>
                <tbody style="font-size: 1.3em;">
                    <!-- Button trigger modal -->
                    <button type="button" class="btn btn-info pull-right addItem" data-toggle="modal" data-target="#exampleModal">
                      Add
                    </button>
                @foreach($data as $value)
                    <tr class="itemList" data-toggle="modal" data-target="#exampleModal">                       
                        <input type="hidden" id="id" value="{{ $value->id }}">  
                        <input type="hidden" id="titleId" value="{{ $value->title_id }}">  
                        <td id="title_name" >                  
                            {{ $value->name }}
                        </td>
                        <td id="transaction_amount" >
                            {{ $value->amount }}
                        </td>
                        <td id="transaction_date">
                            {{ $value->created_at }}
                        </td>
                    </tr>
                @endforeach

              </tbody>
            </table>
            {{ $data->links() }}
        </div>
    </div>
</div>

阿贾克斯部分视图.php

$(".searchField").change(function() 
{
    var title_id = $("#selectTitleId_search").val();
    var date = $('#datepicker').val();
    var token = $('input[name=_token]').val();
    var report_type_id = 1;
    // console.log(date);
    $.ajax({
        url:"/filter",
        type: 'POST',
        data: {_token :token, title_id : title_id, date : date, report_type_id : report_type_id},
        success:function(msg)
        {
            console.log(msg);
            $(".itemList").append(msg);
        }
    });
});

现在如何将 ajax 响应数据发送到表的 foreach(( 循环以显示过滤后的数据

Answer 1

在 ajax 成功函数中使用 foreach 循环并将数据附加到列表

$.ajax({
    url:"/filter",
    type: 'POST',
    data: {_token :token, title_id : title_id, date : date, report_type_id : report_type_id},
    success:function(msg){
        console.log(msg);
        msg.forEach(function(item) {
            // do something with `item`
            $(".itemList").append(item);
        });
    }
});