ループ内のテーブルにチェックボックスを作成し、それらのonclick関数を呼び出すコードがあります。onclick関数では、テーブルのチェックされたチェックボックスの位置ホルダーとなるグローバル配列を設定しようとしています。また、行がチェックされている場合は、その行のテキストフィールドの数値を合計する必要があり(これを変数のパーセンテージに追加します)、変数が100を超える場合は、ユーザーに警告し、チェックボックスに値を入力するように依頼する必要があります合計が100未満になるようにします。
私の問題は、チェックボックスをクリックするたびにグローバル配列が入力され、合計が期待どおりに変数に格納されますが、チェックボックスの「チェックマーク」がすぐに表示されないことです。
この問題を解決するにはどうすればよいですか?
コード:
{
var tabId=document.getElementById("AmnestyTransTbl");
var tabrows = tabId.getElementsByTagName('tr');
var percentage=0,c,n;
var ar=[];
for(var i=1,c=2;i<=tabrows.length-3;i++,c=c+2)
{
// Create CheckBox
ar[i]=c;
var checkBox = document.createElement("input");
checkBox.setAttribute("type", "checkbox");
checkBox.id='CB'.concat(i);
checkBox.onclick = function ()
{
var tabId1=document.getElementById("AmnestyTransTbl");
var rowInd=getRowIndex(this);
CBValue[rowInd]=this.checked;
n=ar[rowInd-1];
percentage=(parseInt(percentage) + parseInt(tabId1.getElementsByTagName("input")[n].value));
if(parseInt(percentage)>100)
{
alert("Amnesty Percentage,"+percentage+", greater than 0!. Plesase check again.");
this.checked=false;
}
if(this.checked==false)
percentage=parseInt(percentage)-parseInt(tabId1.getElementsByTagName("input")[n].value);
} }
var td = document.createElement("td");
td.appendChild(checkBox);
tabrows[i+1].cells[1].appendChild(td);
}
function getRowIndex(el)
{
while((el=el.parentNode) && el.nodeName.toLowerCase() != 'tr');
if (el)
return el.rowIndex;
}