PHP / Javascript - 通过POST将日期字符串传递给AJAX无法正常工作

时间:2013-02-03 15:58:09

标签: php javascript ajax

我正在创建一个将数据发布到MySQL的简单表单。你的想法为什么POST而不是GET?这个表单中有一个描述字段允许多个字符,并且鉴于GET有其字符限制,我选择使用POST。

没有进一步的说明,这是我的HTML表单。

<form name="addExperienceForm" id="addExperienceForm" style="display:none;">
                    Title:<input type="text" name="title" id="title" />
                    From:<input type="text" name="startDate" id="startDate" />
                    To:<input type="text" name="endDate" id="endDate" />
                    Description:<textarea type="message" name="description" id="description"></textarea>
                    <input type="button" value="Submit" onclick="addUserExp()"/>
 </form>

这里是表单中日期框的jQuery Datepicker代码:

//allow a date range to be selected
        $("#startDate").datepicker({
                    changeMonth : true,
                    changeYear : true,
                    dateFormat : "M,yy",
        })
        $("#endDate").datepicker({
                    changeMonth : true,
                    changeYear : true, 
                    dateFormat : "M,yy",
        })  

这是AJAX函数调用:

function addUserExp(){
        var title = document.getElementById('title').value;
        var startDate = document.getElementById('startDate').value;
        var endDate = document.getElementById('endDate').value;
        var description = document.getElementById('description').value;
        var str = "title="+title+"start="+startDate+"end="+endDate+"desc="+description;
        var req = getXMLHTTP();

        if(req){

            req.onreadystatechange = function(){
                if (req.readyState == 4) {
                    // only if "OK"
                    if (req.status == 200) {                        
                        document.getElementById('addNewExp').innerHTML=req.responseText;    


                    } else {
                        alert("There was a problem while using XMLHTTP:\n" + req.statusText);
                    }
                }
            }
        }
        req.open("post", "addExperience.php", true);
        req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        req.send(str);
    }

我怀疑问题出在AJAX调用中,可能与我的'str'变量有关。

3 个答案:

答案 0 :(得分:1)

我没有测试过您的代码,但不应该是:

 var str = "title="+title+"&start="+startDate+"&end="+endDate+"&desc="+description;

答案 1 :(得分:0)

经过无数个小时的审查我的代码后,我终于意识到我的PHP代码就是问题所在。

在:

   <?php


$title = $_POST['title'];
$startDate = $_POST['startDate'];
$endDate = $_POST['endDate'];
$description = $_POST['desc'];

echo $title;
echo $startDate;
echo $endDate;
echo $description;

?>

和之后:

    <?php


$title = $_POST['title'];
$startDate = $_POST['start'];
$endDate = $_POST['end'];
$description = $_POST['desc'];

echo $title;
echo $startDate;
echo $endDate;
echo $description;

?>

注意$ post变量没有反映我的JS字符串。

感谢所有协助的人。

答案 2 :(得分:-1)

使用jQuery来处理AJAX请求要容易得多:

function addUserExp(){
        var title = document.getElementById('title').value;
        var startDate = document.getElementById('startDate').value;
        var endDate = document.getElementById('endDate').value;
        var description = document.getElementById('description').value;
        $.post("addExperience.php", { "title": title, "start": startDate, "end": endDate, "desc":description })
        .done(function(data) {
            document.getElementById('addNewExp').innerHTML=data; 
        })
        .fail(function() { 
            alert("There was a problem with request."); 
        });         
    }

您可以阅读有关$ .post here的更多信息。