0

動的に作成された文字列を document.getElementById の clientID として渡すときに何か特別なことをする必要がありますか?

テキストボックス列とチェックボックス列を持つ asp:gridview コントロールがあります。チェックボックスにonclickイベントを追加して、その行のテキストボックスの値をチェックされたすべての行の最大値+1に設定しました。グリッドの ID と、選択された行のコントロールを渡します。これらのコントロールの getElementByID は正常に取得できますが、他のコントロールの ID を動的に作成すると、ID が正しいことを知っていても、null を取得し続けます。私のコードは以下です。

function SetPriority(cbID, tbID, gridID) {
    var cb = document.getElementById(cbID);
    if (cb.checked) {
        var tb = document.getElementById(tbID);
        var grid = document.getElementById(gridID);

        var maxv = 0;

        for (var i = 0; i < grid.rows.length; i++) {
            var indexID = 102 + i;
            var cbClientID = 'LeaveInfo_pnlMain_wgbLeaveSummary_gridSubmitted_ct' + indexID + '_chkGroup';
            var tbClientID = 'LeaveInfo_pnlMain_wgbLeaveSummary_gridSubmitted_ct' + indexID + '_txtPriority';

            console.log("row" + i);

            //just for example of how it should be working
            console.log(cbID);
            var cbx = document.getElementById(cbID);
            console.log(cbx);

            //get row checkbox
            console.log(cbClientID);
            var thisCB = document.getElementById(cbClientID);
            console.log(thisCB);

            //get row textbox
            var thisTB = document.getElementById(tbClientID);
            console.log(thisTB);

            if (thisCB) {
                if (thisCB.type == "checkbox") {
                    if (thisCB.checked) {
                        if (thisTB.value > maxv)
                            maxv = thisTB.value;
                    }
                }
            }

        }
        tb.value = parseInt(maxv) + 1;
    }
}

これがコンソールにどのように表示されるかです。最初の行のIDが同じであることを確認できます コンソール ログのスクリーンショット

関数を呼び出す方法について疑問に思っている人のために、行データバインドの.netグリッドビューコントロールのチェックボックスに追加しています。次のようにレンダリングされます。

<input id="LeaveInfo_pnlMain_wgbLeaveSummary_gridSubmitted_ctl02_chkGroup" type="checkbox" name="LeaveInfo$pnlMain$wgbLeaveSummary$gridSubmitted$ctl02$chkGroup" onclick="javascript:SetPriority('LeaveInfo_pnlMain_wgbLeaveSummary_gridSubmitted_ctl02_chkGroup','LeaveInfo_pnlMain_wgbLeaveSummary_gridSubmitted_ctl02_txtPriority','LeaveInfo_pnlMain_wgbLeaveSummary_gridSubmitted');">

関数を追加する vb .net コードはこれです...(on-_RowDataBound)

        Dim chk As CheckBox = CType(e.Row.FindControl("chkGroup"), CheckBox)
        Dim tb As TextBox = CType(e.Row.FindControl("txtPriority"), TextBox)

        chk.Attributes.Add("onclick", String.Format("javascript:SetPriority('{0}','{1}','{2}');", chk.ClientID, tb.ClientID, gridSubmitted.ClientID))
4

3 に答える 3

0

同一のように見えるIDがなぜそうでないのか理解できませんでした。私はこの質問を誰にでも開いたままにして、これを改善する方法についての洞察を追加します。IDではなくセルごとに要素を取得することになりました。

function SetPriority(cbID, tbID, gridID) {
    var cb = document.getElementById(cbID);
    if (cb.checked) {
        var tb = document.getElementById(tbID);
        var grid = document.getElementById(gridID);

        var maxv = 0;

        if (grid.rows.length > 0) {
            for (row = 1; row < grid.rows.length; row++) {
                var thisCB = grid.rows[row].cells[5].childNodes[1];
                if (thisCB == cb) {
                    continue;
                }
                var thisTB = grid.rows[row].cells[6].childNodes[1];

                if (thisCB.type == "checkbox") {
                    if (thisCB.checked) {
                        if (thisTB.value > maxv)
                            maxv = thisTB.value;
                    }
                }
            }
        }

        tb.value = parseInt(maxv) + 1;
    }
}
于 2012-12-17T20:21:28.563 に答える
0

いいえ、文字列を動的に構築するときに特別なことをする必要はありません。JavaScript の文字列は、動的に作成されたか、コードで直接指定されたかにかかわらず、同じ文字列です。document.getElementById() が機能しない場合は、次のいずれかが原因である可能性があります。

  1. あなたの文字列はあなたが思っているものではないので、ターゲットIDと一致しません.
  2. あなたの DOM ID は、あなたが思っているものではありません。
  3. 同じ id を持つ複数の要素があります (取得できないため、ここではありそうにありませんnull)
  4. getElementById()DOM の準備が整う前、または必要な要素が DOM に追加される前に呼び出しています。

この場合、1) または 2) が問題である可能性が高いようですが、4) が​​問題であるかどうかを知るためのコンテキストは示されません。

于 2012-12-17T18:23:07.550 に答える
0

100%確実ではありませんが、コンテキストの問題である可能性があると思います。これを試して：

           function ( id ) {

            var ID  = document.getElementById;
            this.id = id;
            this.newvar = ID.call( document, this.id );

                  ... 

                }

また、この質問が役立つ場合があります — コンテキストと var の getElementById への割り当てに関する適切な説明がありますなぜ document.getElementById を別の関数に直接割り当てることができないのですか?

于 2012-12-17T19:16:55.617 に答える