我无法理解为什么这个 ajax 查询失败,尽管它看起来很简单。我只是传递了一个新名称,并要求创建一个新记录,然后刷新一个包含新记录的选择列表。
这是将函数附加到新建、编辑、保存和取消按钮的 jQuery 代码:
var is_new = 0;
$(document).ready(function()
{
// Attach event handlers to buttons
$('#editbtn').on('click',pop_studyname);
$('#newbtn').on('click',new_studyname);
$('#savebtn').on('click',save_studyname);
// disable the Save button until we have something to save
$('#savebtn').attr('disabled',true);
// disable the Cancel button until we have something to cancel
$('#cancelbtn').attr('disabled',true);
});
function pop_studyname()
{
// pop the selected studyname into edit box.
$('#edit_field').val($('#studylist :selected').text());
// disable the New Study button
$('#newbtn').attr('disabled',true);
// enable the Cancel button
$('#cancelbtn').attr('disabled',false);
// and bind it to a function
$('#cancelbtn').on('click',cancel_studyname);
// enable the Save button
$('#savebtn').attr('disabled',false);
// and bind it to a function
$('#savebtn').on('click',save_studyname);
}
function new_studyname()
{
// clear edit box.
$('#edit_field').val('');
/**************************/
/* set flag for New Study */
is_new = 1;
/**************************/
// Enable the Cancel button
$('#cancelbtn').attr('disabled',false);
// and bind it to a function.
$('#cancelbtn').on('click',cancel_studyname);
// Disable the Edit button.
$('#editbtn').attr('disabled',true);
// Enable the Save button
$('#savebtn').attr('disabled',false);
// and bind it to a function.
$('#savebtn').on('click',save_studyname);
// put the cursor in the edit box
$('#edit_field').focus();
}
function cancel_studyname()
{
// clear edit box.
$('#edit_field').val('');
// disable cancel button.
$('#cancelbtn').attr('disabled',true);
// disable Save button.
$('#savebtn').attr('disabled',true);
// Enable the Edit button.
$('#editbtn').attr('disabled',false);
// And the New Study button.
$('#newbtn').attr('disabled',false);
// Reset new study trigger variable.
is_new = 0;
}
function save_studyname()
{
// Are we saving a new or existing Study?
if (is_new == 1) {
$.ajax({
type: 'POST',
URL: "saveStudyName.php",
data: {'type': 'new', 'studyname': $('#edit_field').val()},
dataType: "json",
success: function(resultmsg) {
alert(resultmsg);
},
error: function() {
console.log(resultmsg);
alert('Huston, we have a problem...');
}
});
// reset the trigger flag
is_new = 0;
}
else {
// Update an existing Study.
// Get the record index and edited study name.
var styndx = $('#studylist option:selected').val();
var studyname = $('#edit_field').val();
// Use ajax post call to update database.
$.post("saveStudyName.php", {'type': 'update', 'studyname':studyname, 'styndx':styndx},
function(resultmsg) {
// refresh the picklist
refresh_studynames();
// clear the edit field
$('#edit_field').val('');
});
}
// disable the Save button
$('#savebtn').attr('disabled',true);
// Enable the Edit button.
$('#editbtn').attr('disabled',false);
// Enable the New Study button.
$('#newbtn').attr('disabled',false);
// Finally, refresh the studyname picklist.
refresh_studynames();
}
这是被调用的 PHP 脚本:
$type = $_POST['type'];
$studyname = $_POST['studyname'];
$styndx = $_POST['styndx'];
//$a = json_decode($_POST[],true);
$debug=0;
if ($debug) {
echo "studyname = ".$studyname."<br>";
echo "styndx = ".$styndx."<br>";
echo "type = ".$type."<br>";
}
// query the database.
$dbconnect = pg_pconnect("host=".$hostname." user=".$dbuser." dbname=".$dbname);
if (!$dbconnect) {
showerror(0,"Failed to connect to database",'saveStudyName',30,"username=".$dbuser.", dbname=".$dbname);
exit;
}
if ($type == 'new') {
$sql = "INSERT INTO ibg_studies (ibg_studyabrv) VALUES ('".$studyname."')";
} else {
$sql = "UPDATE ibg_studies SET studyabrv='".$studyname."' WHERE ibg_studies_index=".$styndx;
}
$debug=0;
if ($debug) {
echo "SQL = ".$sql;
}
$fetchresult = pg_exec($dbconnect, $sql);
if ($fetchresult) {
$msg = "Success!";
} else {
$msg = "Failure! SQL="+$sql;
}
echo json_encode($msg);
当我使用 Chrome 调试器单步执行 javascript 时,ajax 的成功或错误子句都不会触发,尽管我可以看到 jQuery 被调用......所以这对我来说是个谜!