いつもお世話になっております。
どなたか分かる方、ご教授お願いします。
前提・実現したいこと
webアプリケーションの開発で、Tableの行をクリックしたときに、その行を黄色にハイライトし、
hidden要素に行の値の一部を取得する、というJavaSciptを埋め込んでいます。
システムの稼働環境として、IE8と11に対応する必要があり、IE8では想定した動きをすることが
確認できているのですが、IE11では動きませんでした。
発生している問題・エラーメッセージ
IE11の開発者ツールを使用し、ウォッチ式を設定したところ、
JavaScript
1OnDemListClick(this.rowIndex,'#DCDCDC','#ffff00','GV_DemList');
このthis.rowIndexのところで、
'rowIndex' は定義されていません。
とエラーが出ていることが分かりました。
関数に渡った時点で、値は-1になってしまいます。
なお、IE8で確認したときには、想定どおりTableの行インデックス番号(1, 2, 3など)が
取得できているのが確認できています。
該当のソースコード
JavaScript
1var objState; 2var RowState; 3 4//申請管理No.リストで行クリック_行番号を渡す 5function OnDemListClick(RowNo, NoSelectColor, SelectColor, GVName) { 6 if (RowNo > 0) { 7 ChengeRowColor(RowNo, NoSelectColor, SelectColor, GVName); 8 9 //申請管理No.を隠し要素に格納 10 var DemNo = document.getElementById(GVName).rows[RowNo].cells[0].innerHTML; 11 document.getElementById("hid_DemNo").value = DemNo; 12 } 13} 14 15//行の色変更(行番号を渡す) 16function ChengeRowColor(RowNo, NoSelectColor, SelectColor, GVName) { 17 if (RowState != null) { 18 //行の選択が開放されるとき、偶数行ならグレー、奇数行なら淡いグレーにする 19 if (RowState % 2 == 0) { 20 document.getElementById(GVName).rows[RowState].style.backgroundColor = '#DCDCDC'; 21 } else { 22 document.getElementById(GVName).rows[RowState].style.backgroundColor = '#EEEEEE'; 23 } 24 } 25 //選択行は選択行カラーに変える 26 document.getElementById(GVName).rows[RowNo].style.backgroundColor = SelectColor; 27 RowState = RowNo; 28} 29
html
1※aspx.vbにより自動生成された結果 2 3<div id="main"> 4 <div id="DataGridErea"> 5 <div> 6 <table class="scroll1" cellspacing="0" cellpadding="3" rules="cols" id="GV_DemList" style="border-color:#999999;border-width:1px;border-style:None;border-collapse:collapse;"> 7 <thead> 8 <tr style="color:White;background-color:#000084;font-weight:bold;"> 9 <th scope="col" style="width:120px;">申請管理No.</th><th align="center" scope="col" style="width:80px;">申請種別</th><th align="center" scope="col" style="width:190px;">申請部署</th><th align="center" scope="col" style="width:100px;">状況</th><th align="center" scope="col" style="width:120px;">次判定者</th><th align="center" scope="col" style="width:90px;">作成者</th><th align="center" scope="col" style="width:140px;">完了希望日</th><th align="center" scope="col" style="width:190px;">最終更新日</th> 10 </tr> 11 </thead><tbody> 12 <tr onClick="OnDemListClick(this.rowIndex,'#DCDCDC','#ffff00','GV_DemList');" style="color:Black;background-color:#EEEEEE;"> 13 <td style="width:120px;">180001</td><td align="center" style="height:1.2em;width:80px;">新規</td><td align="center" style="width:190px;">部署1</td><td align="center" style="width:100px;">検討待ち</td><td align="center" style="width:120px;">ユーザーA</td><td align="center" style="width:90px;">ユーザーB</td><td align="center" style="width:140px;">2018/3/27</td><td align="center" style="width:190px;">2018/02/22 19:07:46</td> 14 </tr> 15 </tbody> 16 </table> 17</div> 18 <input type="hidden" name="hid_DemNo" id="hid_DemNo" /> 19 </div> 20 <p class="clearLeft"></p> 21 22 <div class="DemButton"> 23 <input type="submit" name="btn_Delete" value="申請削除" onclick="return confDelete();" id="btn_Delete" class="btn_Middle" /> 24 <input id="btn_Show" type="button" value="参照/編集" 25 onclick="openDemInfoWindow();" class="btn_Middle"/> 26 </div> 27 </div>
※ASP.net Private Sub GV_DemList_RowDataBound(sender As Object, e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GV_DemList.RowDataBound If e.Row.RowType = DataControlRowType.DataRow Then e.Row.Attributes.Add("onClick", "OnDemListClick(this.rowIndex,'#DCDCDC','#ffff00','GV_DemList');") End If End Sub
試したこと
rowIndexを渡すのではなく、直接TableRowを渡すように、
JavaScript
1OnDemListClick(this,'#DCDCDC','#ffff00','GV_DemList');
と書き換え、関数の方もすべて対応するように修正してみた場合も、
IE8では動くのに、IE11では動きませんでした。
補足情報(FW/ツールのバージョンなど)
.NetFramework 4.0
Visual Studio 2010
不足事項がありましたら、ご指摘ください。
よろしくお願いいたします。
回答3件
あなたの回答
tips
プレビュー