サーバーによって生成された HTML 入力要素があり、次のようになります。
サーバー側はこちら
"<input id='" + cRoadList.getRoadListNumber() + ",start_km' style='' type=\"text\" value='"+ cRoadList.getStartKm() + "' onkeypress='handleRoadListDataUpdate(\""+cRoadList.getStartKm()+"\")'
ご覧のとおり、入力要素の属性は動的に生成されますが、そうではないため、次のような静的データを配置して単純化しましょう。
"<input id='myID' style='' type=\"text\" value='100' onkeypress='handleRoadListDataUpdate(\"100\")'
この HTML 入力要素の最も重要な部分は、関数handleRoadListDataUpdateを呼び出すonkeypressイベントです。
これがクライアント部分です
function handleRoadListDataUpdate(oValue) // The function accpets the old value of the *input* element
{
var event = handleRoadListDataUpdate.caller.arguments[0] || window.event ;
var keyPressed = event.keyCode;
if(keyPressed == 13)
{
var roadListNumber = event.target.id.split(",")[0];
var inputId = event.target.id.split(",")[1];
var nValue = event.target.value;
if(nValue != oValue)
{
var userAction = confirm("Are you sure you want to change this value?\nPrevious value: " + oValue + "\nNew value: " + nValue);
if(userAction == true)
{
var url = "/GBS/RoadListController";
var params = "type=updateRoadList&roadListNumber=" + roadListNumber + "&updateData="+inputId + "&newValue="+ nValue;
dhtmlxAjax.post(url,params,function(loader)
{
var xmlDoc = loader.xmlDoc.responseXML;
var sqlResponse = xmlDoc.documentElement.getElementsByTagName("response");
var result = sqlResponse[0].getAttribute("value");
if(result == "sql_error")
{
alert("The operation could not be completed because of an network error!");
event.target.value = oValue;
}
else if(result == "sql_success")
{
alert("The operation completed successfully!");
//Change the parameter oValue of the parent function
}
});
}
else
{
event.target.value = oValue;
}
}
}
}
基本的に、この関数は、ユーザーが入力要素内に入力した新しい値でデータベースを (ajax を使用して) 更新し、キーEnterを押します。パラメータ oValue が入力要素のパラメータと異なる場合、Ajax リクエストが作成され、データベースを新しい値で更新できます。
操作が完了すると、入力要素 (ユーザーが入力したもの)に新しい値が入りますが、問題は、パラメーター oValue が新しい値で変更されていないため、もう一度 Enter キーを押すと、関数が再度実行されることです。
だから私の質問は次のとおりです。
handleRoadListDataUpdate() 関数のパラメーターoValueをnValueと同じになるように変更して、ユーザーが誤って Enter キーを押した場合に関数が ajax 部分を再度実行しないようにする方法は?
PS
jQuery コードは使用しないでください。純粋な JavaScript のみ!