2列のラジオボタンがあります。左側の1つを選択すると、対応する右側のチェックがオフになり、その逆も同様です。次に、現在選択されているラジオボタンの背景が青、もう1つが白になるように、JavaScriptを追加しました。これはうまくいきました。次に、2つのボタンを追加しました。1つは左側のすべてのラジオボタンをチェックし、もう1つは右側のすべてのラジオボタンをチェックします。ここで私の問題が発生します。ボタンを使用するたびに、ラジオボタンは正しくチェックされますが、背景色が正しく表示されません。
例1
列1のラジオボタンをオンにし、起動時に背景を青にしてから、ボタンを押して列2をアクティブにすると、列2のラジオボタンがすべてチェックされ、背景が一瞬青に点滅し、列1の背景は青のままになります。
例2
起動時に、列1のラジオボタンをオンにしましたが、背景色には影響していません。ボタンを押して列2をアクティブにし、列2のラジオボタンがすべてチェックされ、背景が一瞬青に点滅してから白に戻ります。列1のボタンをクリックしても同じ影響があります(ラジオが選択され、青で点滅し、白に戻ります)。
何が問題になるのでしょうか?ポストバックだったのではないかと思いましたが、確かにラジオのチェック値も更新されていたので、そうではないと思います。どんな助けでも大歓迎です。
コード
これは、列を選択するためのボタンです。関数が渡されるコントロールは、これだけです(つまり、クリックされたボタン)。ラジオボタンは動的に作成されるため、少し複雑です。要点は、どのボタンが押されたかを判断し、関連するラジオボタンをループしてチェックし、親の親(td要素)の背景の色を変更します...それが理にかなっている場合。
function ColumnBtnSelect(control) {
var btnNum = (control.id).substring((control.id).length - 1, (control.id).length);
var objPart = "ctl00_ContentPlaceHolder1_GridView1_ctl";
var objName;
for (x = 3; x <= 15; x++) {
if (btnNum == 1) {
var num1 = "0" + x;
objName = objPart + num1.substr(num1.length - 2) + "_" + ((x - 3) * 2);
document.getElementById(objName).checked = true;
$(document.getElementById(objName)).parent().parent().css("background-
color", "#A9D0F5");
}
else {
var num1 = "0" + x;
objName = objPart + num1.substr(num1.length - 2) + "_" + (((x - 3) * 2) + 1);
document.getElementById(objName).checked = true;
$(document.getElementById(objName)).parent().parent().css("background-
color", "#A9D0F5");
}
}
アップデート
あなたの提案を読んだ後、私は自分のコードを振り返りました。対応するラジオボタンを白に設定する別のJavaScript関数がありましたが、例2を試したので、コメントアウトしました。つまり、現時点ではコードのどこにも白に設定していませんが、それでも行が切り替わっているようです。一時的に青になり、次に白に戻ります。非常に奇妙な。また、FirebugでCSSをチェックしました。すべてのtd要素(青である必要がありますが、実際には白です)は、背景色の設定をリストしていないようです。白でも青でもありません。これはオーバーライドされていないように見えますが、おそらくデフォルトに戻っていますか?いずれにせよ、私は困惑しています!