javascript - 使用 jQuery 在 Laravel Blade 上显示 Controller 变量

标签 javascript php jquery laravel

在我的 laravel 应用程序中,我在 Blade 上有一个 div 来显示每日订单总数。

<div class="row mt-3" id="shopify_row1">
        <div class="col-md-2" id="shopify_widget1">
            <div class="jumbotron bg-dark text-white">
                <img class="img-fluid pull-left" src="https://cdn0.iconfinder.com/data/icons/social-media-2092/100/social-35-512.png" width="32" height="32">
                <h6 class="text-secondary mt-2 px-4">Shopify</h6>
                <hr class="border border-white">
                <h5 class="text-white">Total Orders</h5>
                <span class="tot_o" id="tot_o">{{ $tot_o }}</span> 
            </div>
        </div>
</div>

我明白了$tot_o通过 Controller 。

以下是我的index()在 Controller 中

if($request->has('selected_date')){
                $selected_date=$request->selected_date;
                $url = "https://<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="d39e8a92839a98968a939e8a80879c8196fdbeaaa0bbbca3bab5aafdb0bcbe" rel="noreferrer noopener nofollow">[email protected]</a>/admin/api/2022-10/orders/count.json?status=any&created_at_max=".$selected_date."";
            }else{
                $selected_date = date('Y-m-d');
                $url = "https://<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="733e2a32233a38362a333e2a20273c21365d1e0a001b1c031a150a5d101c1e" rel="noreferrer noopener nofollow">[email protected]</a>/admin/api/2022-10/orders/count.json?status=any&created_at_min=".$selected_date."";
            }
            $curl = curl_init( $url );
            curl_setopt($curl, CURLOPT_HTTPHEADER, array("Content-Type: application/json"));
            curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
            $json_response = curl_exec($curl);
            curl_close($curl);
            $result_1 = json_decode($json_response, TRUE);
            $tot_o = $result_1['count'];
  return view('dashboard.index', ['sum' => $sum, 
                'tot_o' => $tot_o]);

现在我正在尝试实现一个日期选择器,因此 $tot_o 的值是否应该根据所选日期进行更改。

这是我的日期选择器。

<td>
      <input id="date" class="date form-control" type="date">
</td>

这是我的 JavaScript。

<script>
        $(document).on('change', '#date', function (e) {

        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        $.ajax({
            type: 'GET',
            url : '/home',
            data : {selected_date : $('#date').val()},
            success:function(data){

            $('#tot_o').empty(); 
            var total_orders = JSON.parse("{{ json_encode($tot_o) }}")
            console.log(total_orders);

            },
            timeout:10000
        });

    });    
    </script>

但在这里,当我 console.log 我的输出时,它总是给我 0,即使总数大于 0...

如何更正我的 JS 以显示 <span class="tot_o" id="tot_o"></span> 内的值正确...

最佳答案

在 Controller AJAX中

return response()->json([
    'tot_o' => $tot_o
]);

所以在 AJAX 中

success:function(data){
    var total_orders = data.tot_o;
    $('#tot_o').text(total_orders);
},

跨度应为 (id="tot_o")

<span class="tot_o" id="tot_o"></span>

可以使用.text().html()写入数据

关于javascript - 使用 jQuery 在 Laravel Blade 上显示 Controller 变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/74871485/

相关文章:

javascript - Kotlin JS 不会在需要的地方添加 "new"关键字

javascript - 有没有办法让每个用户而不是每个选项卡运行一个服务器发送事件?

javascript - jQuery插件: Expanding Boxes/Sliding Panels

javascript - Chrome 10 : Custom Video Interface Problem

javascript - 按回车键打开弹出窗口

javascript - 使用 JavaScript 将字符串从其他字符串中剥离(如果该字符串以该字符串开头)

javascript - redux thunk 不等待任何 promise

javascript - Twitter Bootstrap - 动态添加/删除选项卡和选项卡内容

php - 可以从 COUNT 查询中提取信息吗?

php - 无法在 Phpstorm 中为 composer 添加命令行工具支持