繁体   English   中英

从模型和控制器获取刀片视图中的 json

[英]get json in blade view from model and controller

我正在尝试将一个“旧”的 php 脚本转换成 Laravel 这个脚本工作正常。 我正在 jQuery fullcalendar 中显示一些数据。 但是现在我正在尝试将其集成到 Laravel 项目中

我不想使用maddhatter 包。 我只想在日历上显示存储在我的 mysql 表中的一些数据。 我不需要插入、更新等。

用于数据库查询的 php 页面:fetch-event.php

$json = 数组(); $sqlQuery = "SELECT * FROM tbl_events ORDER BY id";

$result = mysqli_query($conn, $sqlQuery);
$eventArray = array();
while ($row = mysqli_fetch_assoc($result)) {
    array_push($eventArray, $row);
}
mysqli_free_result($result);

mysqli_close($conn);
echo json_encode($eventArray);

javascript , calendar.php 页面

<script>
$(document).ready(function () { 
    var calendar = $('#calendar').fullCalendar({
        editable: false,
        events: "fetch-event.php",       
        } ,
        eventClick: function (event) {            
            $.getJSON('fetch-event.php', function (user) {
    var convertToTableau=Array.from(Object.values(user));
    var us=$.grep(convertToTableau,function(v){  
                  return v.id==event.id;                
    });

    $("#firstname").text(us[0].title);
    $("#idpilote").text(us[0].id); 
});
        }
    });
});

</script> 

如何通过将这段代码转换为带有模型、控制器和视图的 laravel (5.8) 来转置这段代码。 感谢您的帮助。

这就是我在解决方案中所做的工作

我创建了一个控制器

namespace App\Http\Controllers;

use App\Post;
use Illuminate\Http\Request;

class CalendrierController extends Controller
{
    public function getCalendrier()
    {
       // the view containing the fullcalendar
         return view('admin.blog.calendrier');        

    }

    public function getCalendrier2() {
        // the page who extract the data of the query 
        //(simple display of the data of the table) in json
        $products = Post::all();
        return $products;
    }
}

一个模型

namespace App;

use Illuminate\Database\Eloquent\Model;

class Post extends Model
{

    protected $fillable = [
        'name',
        'prenom',
        'adresse',
        'phone',        
        'date1',
        'date2',
        'date_born',
        'lieu_born',
        'nationalite',
        'profession',
        'type_avion',
        'immat_avion',
    ];


    public $timestamps = false;
}

显示全日历视图的路由

Route::get('/blog/calendrier', [   
        'uses' => 'CalendrierController@getCalendrier', 
        'as' => 'admin.blog.calendrier' // 
    ]);

带有 jquery 脚本的 fullcalendar 的刀片视图

<script>
                            $(document).ready(function() {

                                var calendar = $('#calendar').fullCalendar({
                                    editable: false,
                                    events: "{{ route('products') }}",                                    
                                    eventClick: function(event) {

                                        $.getJSON("{{ route('products') }}", function(user) {
                                            var convertToTableau = Array.from(Object.values(user));
                                            console.log(convertToTableau);
                                            var us = $.grep(convertToTableau, function(v) {


                                                return v.id == event.id;
                                                console.log(event.id);

                                            });
                                            $("#firstname").text(us[0].name);
                                            $("#idpilote").text(us[0].id);
                                        });
                                    }

                                });
                            });
                        </script>

                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-12">

                    <div class="response"></div>
                    <div id='calendar'></div>
                    <div>
                        <p id="firstname"></p>
                        <p id="idpilote"></p>
                    </div>
                </div>
            </div>

在 json 中为 jquery 脚本中的 url 显示输出查询的路由

Route::get('/products', [   
    'uses' => 'CalendrierController@getCalendrier2', 
    'as' => 'products' 
]);

在此页面(产品)中,我显示了 json

[{"id":1,"name":"Martin","prenom":"Andr\u00e9","adresse":"125 rue des Bleuets , Lamorlaye, 60005, France","phone":"0102030102","date1":"2019-07-01","date2":"2019-07-31","date_born":"1942-01-01","lieu_born":"Charleroix , Belgique","nationalite":"Fr","profession":"Pilote","type_avion":"Planneur","immat_avion":"DZ582MMA"},{"id":4,"name":"Raymond","prenom":"Michel","adresse":"15 avenue des platanes, Riez, 04250, Fr","phone":"04258745","date1":"2019-07-07","date2":"2019-07-18","date_born":"1960-05-08","lieu_born":"Toulouse , Fr","nationalite":"Fr","profession":"Pilote","type_avion":"Planneur","immat_avion":"DZ555A"},{"id":5,"name":"Schumacher","prenom":"Hanz","adresse":"Am Hallenbad, 52000, Wurzelen, De","phone":"201748541","date1":"2019-07-05","date2":"2019-07-11","date_born":"1953-05-12","lieu_born":"Berlin , De","nationalite":"De","profession":"Pilote","type_avion":"Planneur","immat_avion":"DZ3547MMA"},{"id":6,"name":"Carbonara","prenom":"Luigi","adresse":"Via Veneto, Roma, It","phone":"2147485","date1":"2019-07-08","date2":"2019-07-15","date_born":"1968-08-02","lieu_born":"Florence , It","nationalite":"It","profession":"Pilote","type_avion":"Planneur","immat_avion":"DBBB7MMA"}]

我认为在 fullcalendar 中有保留字(标题、开始、结束)。 在我的 mysql 表中,我有“date1”和“date2”而不是“start”和“end”和“name”而不是“title”。 我将尝试更改 mysql 表中列的名称。 在此之前,我必须对我的脚本(模型、迁移表等)进行一些小的更改。

当我这样做时,我会回来..

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM