他のSO投稿を確認した後、私の質問に対する答えは見つかりませんでしたが、明らかにこのタイプの問題は他の人にも起こりますが、私の問題ではありません。しかし、理由はわかりませんが、ajax.post関数が2回呼び出されています。
これは、Firefox（Iceweasel）ブラウザを使用するjQuery1.8.0です。
これが、編集、保存、新規、キャンセルの4つのボタンに関数をアタッチする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) {
$.post("saveStudyName.php",
{'type': 'new', 'studyname': $('#edit_field').val()},
function(resultmsg) {
alert(resultmsg);
}
);
// 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) {
alert(resultmsg);
});
}
// 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();
}
function refresh_studynames()
{
// repopulate studylist with update from database...
// - form the query.
// - send to database, get the result.
// - use the result to repopulate the Study name select list.
$.ajax({
url: 'getStudyNames.php', //the script to call to get data
data: "", //you can insert url argumnets here to pass to api.php
//for example "id=5&parent=6"
dataType: 'json', //data format
error: function() {
alert('Refresh of study names failed.');
},
success: function(data)
{
var $studylist = $('#studylist').empty();
$.each(data, function(i, record) {
$studylist.append($("<option/>", {
value: record.studyindex,
text: record.studyname
}));
});
}
});
}
Webコンソールとデバッガーを見ると、2つのPOST（saveStudyName.phpへの）と2つのGET（getStudyNames.phpからの）が互いにわずか数ミリ秒以内に発生していることがわかります。最初の呼び出しは正しいものです。しかし、2番目のものは起こらないはずです。関連するロジックが原因で、2番目の呼び出しのパラメーターが正しくないため、失敗します。
完全を期すために、HTMLコードは次のとおりです。
<body >
<div id="container">
<div id="header">
<h1>Admin Module</h1>
</div>
<div id="navigation">
<ul>
<li><a href="AdminMenu.php">Admin Menu</a></li>
<li><a href="../DNAPortal/DNA_Portal_Menu.php">DNA Portal</a></li>
<li><a href='../DNAPortal/logout.php'>Logout</a></li>>
</ul>
</div>
<div id="content">
<h2>IBG Study Maintenance</h2>
<p>
<form name="StudySelection" action="process_StudyMaint.php" method="POST" onsubmit="return false" >
<input type=hidden name=studyindex>
<div id=content-container2>
<fieldset>
<LEGEND><b>Select Study &/or action</b></LEGEND>
<p>
<P CLASS=select_header>List of Studies<br>
<SELECT multiple size=15 NAME="studylist" ID="studylist" STYLE="width: 150px">
<?php
$i=0;
while ($i < $numstudies) {
$styarr = pg_fetch_row($studyresult);
echo "<option value=$styarr[0]>$styarr[1]\n";
$i++;
}
?>
</select>
</p>
</fieldset>
</div>
<div >
</div>
<div class="lower_block">
Study name:<br>
<input id="edit_field" type="text" size=30>
<input type="button" name="editbtn" id="editbtn" value="Edit" sclass="btn">
<input type="button" name="savebtn" id="savebtn" value="Save" sclass="btn">
<input type="button" name="newbtn" id="newbtn" value="New Study" sclass="btn">
<input type="button" name="cancelbtn" id="cancelbtn" value="Cancel" sclass="btn" disabled=TRUE >
</div>
</div>
</div>
</form>
</body>
2番目の呼び出しが発生しないようにする方法はありますか？これが起こる理由はわかりません。
どんな助けでも大歓迎です！とても素晴らしい！
--rixter