如何将对象从视图传递到控制器

时间:2018-05-18 20:27:47

标签: javascript php jquery laravel fullcalendar

我在视图中填充了一个对象$trial。我想将它作为POST传递给路由,以使用它的数据调用函数。这是为fullcalendar创建一个事件。我很确定我已经坐在这么久了,以至于我在过度思考它。

希望通过eventRender回调执行此操作,但无法弄清楚如何将数据传入其中,尝试简单$.post只是为了获取方法或控制台中的未知状态

目前我有一些虚拟数据。

此处的目标是通过标记的时间范围创建活动。

如果我设法传递数据,则将控制器功能添加到数据库

public function addEvent(Request $request)
{
    //dd($request);

    $event = new Event;
    $event->title = $request['title'];
    $event->start_date = $request['start_date'];
    $event->end_date = $request['end_date'];
    $event->save();

    \Session::flash('success','Event added successfully.');
    return redirect('/events');
}

web.php(路由)

Route::get('/events', 'EventController@index');
Route::post('/events', 'EventController@addEvent');

然后有一个索引函数,我目前最常用于修改表(使其可编辑等)。

public $trial = [];

//
public function index()
{
    $events = [];
    $data = Event::all();
    if($data->count()) {
        foreach ($data as $key => $value) {
            $events[] = Calendar::event(
                $value->title,
                true,
                new \DateTime($value->start_date),
                new \DateTime($value->end_date.' +1 day'),
                null,
                // Add color and link on event
                [
                    'color' => '#f05050',
                    'url' => '/events',


                ]
            );
        }
    }

    $calendar = Calendar::addEvents($events) //add an array with addEvents
    //->addEvent($eloquentEvent, [ //set custom color fo this event
        //'color' => '#800',
    //])
        ->setOptions([ //set fullcalendar options
        'firstDay' => 1,
        'selectable' => true,
        'unselectAuto' => false,
        'selectOverlap' => false,
        'editable' => true,
        'businessHours' => [
            'dow' => [ 1, 2, 3, 4, 5 ],
            'start'=> '08:00',
            'end' => '19:00',
        ]

    ])->setCallbacks([ //set fullcalendar callback options (will not be JSON encoded)
        'eventClick' => 'function(event) {
            console.log("You clicked on an event with a title of: " + event.title);
     }',

        'select' => 'function(start, end) {
            console.log("Selection start: " + start.format() + " selection end: " + end.format());

            $trial = {
                title: "rent",
                start_date: start.format(),
                end_date: end.format()
            };
            console.log($trial);


        }',
    ]);

欢迎任何建议。

编辑:通常,我知道如何传递数据以便在控制器中的函数中使用的唯一方法是通过表单提交

1 个答案:

答案 0 :(得分:1)

我没有特别使用Angular,但它与Vue有许多相似之处。我使用一个名为Axios的平台无关的软件包,它允许您向服务器发送请求。

要回溯一秒,表单基本上是发送帖子请求的一般方式。 url在表单中指定,值是输入字段。

对于任何包,你都会做类似的事情:

  • 指定网址
  • 指定请求类型(post,get等)
  • 传递参​​数(但不是必需的)

使用Axios,它看起来像:

axios.post('/mySite.com/something', { datum1: 'value', datum2: true })
      .then(response => () {
         this.someFunction(response.data);
      });

它有一些ES6魔法(箭头功能),但这与许多请求非常相似。就像我说的,第二个参数是可选的,或者你甚至可以传递一个数据对象。

  • 别忘了还要包含csrf令牌。如果您只是在页眉中添加元标记(请参阅Laravel文档),这是最简单的,但您也可以直接将其作为_csrf参数传递。