【问题标题】:get json in blade view from model and controller从模型和控制器获取刀片视图中的 json
【发布时间】:2020-03-25 07:28:33
【问题描述】:

我正在尝试将“旧”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) 来转换此代码。感谢您的帮助。

【问题讨论】:

  • 您能否描述一下您的事件表的外观(列、表名)并包括传递给 mysql 查询的查询
  • 你好 Divyank,我在下面更详细地回答你

标签: php jquery json laravel


【解决方案1】:

这就是我在解决方案中所做的事情

我创建了一个控制器

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 脚本的完整日历的刀片视图

<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 表中列的名称。在此之前,我必须对我的脚本(模型、迁移表等)进行一些小改动

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

【讨论】:

  • 这就是问题所在。 fullcalendar 脚本使用保留关键字。 “开始”为开始日期。 “end”表示结束日期,“title”表示日历中出现的内容。在我的数据库表中更改 clolums 的名称后,它可以工作。我解决了我的问题。我有一个补充问题:如何在fullcalendar的jquery脚本中将关键字“title”、“start”和“end”换成其他词(例如“name”、“date-start”和“date_end”)?跨度>
猜你喜欢
  • 1970-01-01
  • 2012-12-10
  • 2018-12-16
  • 2012-04-09
  • 1970-01-01
  • 1970-01-01
  • 2011-10-07
  • 2017-12-16
  • 2019-11-13
相关资源
最近更新 更多