将 Ajax 数据发送到 Laravel 控制器

Posted 2023-03-14

【中文标题】将 Ajax 数据发送到 Laravel 控制器

【英文标题】：Send Ajax data to Laravel controller

【发布时间】：2017-03-11 23:29:33

【问题描述】：

我正在使用全日历，我需要在用户点击特定日期时创建一个新事件，我正在使用 Laravel 控制器来存储通过 ajax 请求发送的数据。我可以在日历上创建一个事件，但我无法将数据发送到控制器，而且浏览器选项卡在创建事件后冻结。任何人都可以纠正我错在哪里？或为问题提供更好的解决方案。

select: function(start, end, allDay) 
var title = event_name;// Event Title:
var eventData;
if (title) 
    eventData =  //creates a new event on the calendar 
        title: title,
        start: start,
        end: end,
        allDay: allDay
    ;
    $('#calendar').fullCalendar('renderEvent', eventData, true); // stick? = true

    $.ajax(                        
        data:eventData,
        type: 'POST',
        url:"/projects/calendar/store", // your url
        beforeSend: function (request) 
            return request.setRequestHeader('X-CSRF-Token', $("meta[name='csrf-token']").attr('content'));
        ,
        success: function(response) 
             console.log(response);
        
    );

$('#calendar').fullCalendar('unselect');
,

这是我的 Route 文件，我尝试了 get 和 post，但都没有工作。

Route::get('/projects/calendar/store','FrontEndController@calendarStore');

这是Controller，它只处理ajax请求发送的数据，不处理视图。

public function calendarStore(Request $request)   


$calendar = new Calendar;
Input::all();

$userId = Auth::user()->id;
$event_title =$request->input('title');
$start =$request->input('start');
$end =$request->input('end');

$calendar_event = Calendar::create([
    'user_id' => $userId, // I can get the user ID 
    'project_id' => 2,
    'event_title' => $event_title,
    'start_date' =>$start,
    'end_date' => $end
]);

【问题讨论】：

首先您需要将您的路线更改为发布路线。在您的 ajax 对象中，您在发布数据时将类型设置为 POST，您必须对您的路线执行相同的操作。其次，您是否尝试过在 calendarStore 方法中检查您的网络选项卡和 dd($request)？如果不试试这个，看看你是否得到你的控制器方法。第三，向您的 ajax 对象添加一个错误键，该对象以相同的方式接受 success: function() ... 和 error: function(response) console.log('here', response); 下的闭包，以查看您在发布时是否遇到错误。

有什么错误？必须记录 AJAX 错误或 apache 日志错误。

【参考方案1】：

像这样替换您对 ajax data 参数的声明：

//creates a new event on the calendar 
eventData = 
    "title": title,
    "start": start,
    "end": end,
    "allDay": allDay
;

【讨论】：

只有那些无效的标识符才需要引用属性。我不认为这是问题所在，肯定有其他问题。

【参考方案2】：

我进行了以下修改：它按预期工作，一旦用户在特定日期/日期单击/选择，它将询问标题并将事件保存在数据库中。

select: function(start, end, allDay) 
    var title = prompt('Are u sure you want to apply for job? Yes/No:');// Event Title:
    var start_time = moment(start).format();
    var end_time = moment(end).format(); //onclick get date 
    var eventData;
    if (title) 
        eventData = 
            title: title,
            start: start,
            end: end,
            allDay: allDay
        ;
        $('#calendar').fullCalendar('renderEvent', eventData, true); // stick? = true

        $.ajax(
            type: 'GET',//POST changed to GET
            url: "/projects/calendar/store", // your url                                                
            data:  //event data from global variable 
                title: event_name,
                start: start_time,
                end: end_time,
                event_id:event_id
            ,
            beforeSend: function (request) 
                return request.setRequestHeader('X-CSRF-Token', $("meta[name='csrf-token']").attr('content'));
            ,
            success: function(response) 
                 console.log(response);
            
        );
    
    $('#calendar').fullCalendar('unselect');
,

更新路线

Route::get('/projects/calendar/store','FrontEndController@calendarStore');

更新的控制器

public function calendarStore(Request $request)

    $userId = Auth::user()->id;
    $event_title =$request->get('title');
    $start =$request->input('start');
    $end =$request->input('end');
    $project_id= $request->input('event_id');    


    $calendar_event = Calendar::create([
        'user_id' => $userId,
        'project_id' => $project_id,
        'event_title' => $event_title,
        'start_date' =>$start,
        'end_date' => $end
    ]);     
    return $calendar->all();