AJAX和处理PHP页面 - 不能一起玩

Question

This is a followup to a previous post of mine where the main questions I had centered around FullCalendar. 这是我之前的一篇文章的后续文章，其中主要问题是我围绕FullCalendar。 Now, I have narrowed the suspects down to a problem between my main page and the PHP page that fetches data. 现在，我已经将嫌疑人缩小到我的主页面和获取数据的PHP页面之间的问题。

The "events.php" page returns data just fine when I run it by itself, so there's no problem internal to the page. “events.php”页面在我自己运行时返回数据就好了，所以页面内部没有问题。 All the problems with the JSON have been worked out, so the data being returned is OK (I just pasted it into the "events" line. Also, when in Chrome, and I click on the error then the "response" tab in the error panel (F12), it says "The Request has no response data available". Just manually copy the query string into a URL and paste it into Chrome address bar, the PHP file returns data just fine. JSON的所有问题都已解决，因此返回的数据是正常的（我只是将其粘贴到“事件”行。此外，在Chrome中，我点击错误然后在“响应”选项卡中错误面板（F12），它显示“请求没有可用的响应数据”。只需手动将查询字符串复制到URL并将其粘贴到Chrome地址栏中，PHP文件就可以正常返回数据。

So, here are three parts: my main page, the PHP, and a screenshot of Chrome. 所以，这里有三个部分：我的主页，PHP和Chrome的截图。 ANY insight as to how I can fix this? 关于如何解决这个问题的任何见解？ Pleeeeease... :) Pleeeeease ...... :)

-- HERE'S the resolution. - 这是决议。 Unlike the code that I got from ( here ), I shouldn't have used "localhost:8888/fullcalendar/events.php". 与我从这里获得的代码不同， 我不应该使用 “localhost：8888 / fullcalendar / events.php”。 I even tried " http://mydomain.com/tpsdb/fullcalendar/events.php ", and it didn't work. 我甚至试过“ http://mydomain.com/tpsdb/fullcalendar/events.php ”，但它没有用。 SO.... I just used "events.php", and it works!! 所以....我只是使用了“events.php”，它的确有效！ Thanks guys for helping! 谢谢你的帮助！ I am not too familiar with cross-domain security, but the original paths were correctly typed (I checked a dozen times)... 我不太熟悉跨域安全性，但原始路径输入正确（我检查了十几次）......

<!DOCTYPE html>
<html>
<head>
    <link href='fullcalendar/fullcalendar.css' rel='stylesheet' />
    <script src="//code.jquery.com/jquery-1.10.2.min.js"></script>
    <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
    <script src='fullcalendar/fullcalendar.min.js'></script>
    <script>

        $(document).ready(function() {
            var date = new Date();
            var d = date.getDate();
            var m = date.getMonth();
            var y = date.getFullYear();


            var calendar =
                $('#calendar').fullCalendar({
                editable: true,
                header: {
                    left: 'prev,next today',
                    center: 'title',
                    right: 'month,agendaWeek,agendaDay'
                },

                eventSources: [
                    {
                        url: 'http://localhost:8888/tpsdb/fulcalendar/events.php',
                        type: 'GET',
                        data: {},
                        error: function () {
                            alert('There was an error while fetching events!');
                        }
                    }
                ],

                // Convert the allDay from string to boolean
                eventRender: function(event, element, view) {
                    if (event.allDay === 'true') {
                        event.allDay = true;
                    } else {
                        event.allDay = false;
                    }
                },
                selectable: true,
                selectHelper: true,
                select: function(start, end, allDay) {
                    var title = prompt('Event Title:');
                    var url = prompt('Type Event url, if exits:');
                    if (title) {
                        var start = $.fullCalendar.formatDate(start, "yyyy-MM-dd HH:mm:ss");
                        var end = $.fullCalendar.formatDate(end, "yyyy-MM-dd HH:mm:ss");
                        $.ajax({
                            url: 'http://localhost:8888/fullcalendar/add_events.php',
                            data: 'title='+ title+'&start='+ start +'&end='+ end +'&url='+ url ,
                            type: "POST",
                            success: function(json) {
                                alert('Added Successfully');
                            }
                        });
                        calendar.fullCalendar('renderEvent',
                                {
                                    title: title,
                                    start: start,
                                    end: end,
                                    allDay: allDay
                                },
                                true // make the event "stick"
                        );
                    }
                    calendar.fullCalendar('unselect');
                },

                editable: true,
                eventDrop: function(event, delta) {
                    var start = $.fullCalendar.formatDate(event.start, "yyyy-MM-dd HH:mm:ss");
                    var end = $.fullCalendar.formatDate(event.end, "yyyy-MM-dd HH:mm:ss");
                    $.ajax({
                        url: 'http://localhost:8888/fullcalendar/update_events.php',
                        data: 'title='+ event.title+'&start='+ start +'&end='+ end +'&id='+ event.id ,
                        type: "POST",
                        success: function(json) {
                            alert("Updated Successfully");
                        }
                    });
                },
                eventResize: function(event) {
                    var start = $.fullCalendar.formatDate(event.start, "yyyy-MM-dd HH:mm:ss");
                    var end = $.fullCalendar.formatDate(event.end, "yyyy-MM-dd HH:mm:ss");
                    $.ajax({
                        url: 'http://localhost:8888/fullcalendar/update_events.php',
                        data: 'title='+ event.title+'&start='+ start +'&end='+ end +'&id='+ event.id ,
                        type: "POST",
                        success: function(json) {
                            alert("Updated Successfully");
                        }
                    });

                }

            });

        });

    </script>
    <style>
        body {
            margin-top: 40px;
            text-align: center;
            font-size: 14px;
            font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;

        }
        #calendar {
            width: 900px;
            margin: 0 auto;
        }
    </style>
</head>
<body>
<div id='calendar'></div>
</body>
</html>

Now, the PHP page called "events.php" 现在，PHP页面名为“events.php”

<?php
    // List of events
    $json = array();

    // Query that retrieves events
    $requete = "SELECT * FROM evenement ORDER BY id";

    // connection to the database
    include ('../includes/functions.php');

    // Execute the query
    $resultat = $bdd->query($requete) or die(print_r($bdd->errorInfo()));

    // sending the encoded result to success page
    $tempjson =  json_encode($resultat->fetchAll(PDO::FETCH_ASSOC));
    $tempjson = str_replace('"false"', 'false', $tempjson);
    echo $tempjson;

?>

And finally the screenshot... 最后截图... Chrome屏幕截图

Answer 1

Try using /fullcalendar/update_events.php only instead of adding the host:port. 请尝试仅使用/fullcalendar/update_events.php，而不是添加host：port。 Looks like you are using different hosts for page and ajax. 看起来你正在使用不同的主机页面和ajax。 This will ensure that your code works when publishing on a server. 这将确保您的代码在服务器上发布时有效。

Also, as Bergi said, fullcalendar/update_events.php is in root or inside tpsdb folder? 另外，正如Bergi所说，fullcalendar / update_events.php在root或tpsdb文件夹中？

if you are using another host, then you might be end up with Cross domain security, you need to add Access-Control-Allow-Origin policy in header on the php file 如果您正在使用其他主机，那么您最终可能会遇到跨域安全性，您需要在php文件的头文件中添加Access-Control-Allow-Origin策略

Answer 2

Try adding dataType: "json" to your event source, and/or have your PHP script clearly state that it returns json : 尝试将dataType: "json"添加到您的事件源，和/或让您的PHP脚本清楚地声明它返回json：

//PHP
header('Content-Type: application/json');

//Javascript
eventSources: [
                {
                    url: 'http://localhost:8888/tpsdb/fulcalendar/events.php',
                    type: 'GET',
                    data: {},
                    dataType: 'json',   //<-- add this line
                    error: function () {
                        alert('There was an error while fetching events!');
                    }
                }
            ],

AJAX和处理PHP页面 - 不能一起玩

问题描述

2 个解决方案

解决方案1
2 已采纳 2014-02-11 07:37:32

解决方案2
0 2014-02-11 09:02:55

AJAX和处理PHP页面 - 不能一起玩

问题描述

2 个解决方案

解决方案1 2 已采纳 2014-02-11 07:37:32

解决方案2 0 2014-02-11 09:02:55

解决方案1
2 已采纳 2014-02-11 07:37:32

解决方案2
0 2014-02-11 09:02:55