javascript - JavascriptがAsp Checkbox Checkedプロパティを認識しない

Question

ASPフォームに個々のチェックボックスのリストがあります:

<asp:UpdatePanel runat="server" ID="FiltersUpdPnl">
    <ContentTemplate>
        <div class="filters">
            Show: 
            <asp:DropDownList runat="server" ID="CapNumProjectsDDL" AutoPostBack="true" OnSelectedIndexChanged="GenericFiltersChanged" >
                <%--<asp:ListItem Value="0" Text="" Selected="True"></asp:ListItem>--%>
                <asp:ListItem Value="1" Text="Capacity"></asp:ListItem>
                <asp:ListItem Value="2" Text="Number of Projects"></asp:ListItem>
            </asp:DropDownList>
        </div>
        <div id="filterlist" class="filters">
            <span style="font-size:13pt;display:none;">Filters:<asp:Button runat="server" 
                ID="ApplyFilters1Btn" Text="Apply New Filters" Visible="false" OnClick="ApplyFilters" /> </span>
            <br />
            <span style="font-size:10pt;">Project Type:</span>
            <ul>
                <li>
                    <asp:CheckBox AutoPostBack="true" runat="server" ID="ShowAllChkBx" Text="(check/uncheck all)" 
                        Checked="false" oncheckedchanged="ShowAllChkBx_CheckedChanged" />
                </li>
            </ul>
            <div id="filterchks" runat="server">
                <ul>
                    <li><asp:CheckBox AutoPostBack="true" runat="server" ID="BiomassChkBx" Text="Biomass" Checked="true" Value="7" OnClick="JavaScript:ParentCheck(parent, 'Biomasschks')"/></li>
                        <div runat="server" id="Biomasschks">
                            <ul>
                                <li><asp:CheckBox AutoPostBack="true" runat="server" ID="BiomassUnspChkBx" Text="Biomass" Checked="true" Value="18" OnClick="JavaScript:uncheckParent(this,'BiomassChkBx')"/></li>
                                <li><asp:CheckBox AutoPostBack="true" runat="server" ID="BiomassLandfillGasChkBx" Text="Biomass - Landfill Gas" Checked="true" Value="29" OnClick="JavaScript:uncheckParent(this,'BiomassChkBx')"/></li>
                            </ul>
                        </div>
                    <li><asp:CheckBox AutoPostBack="true" runat="server" ID="CSPChkBx" Text="CSP" Checked="true" Value="11" OnClick="JavaScript:ParentCheck(parent, 'CSPchks')" /></li>
                        <ul>
                            <div runat="server" id="CSPchks">
                                <li><asp:CheckBox AutoPostBack="true" runat="server" ID="CheckBox2" Text="CSP" Checked="true" Value="5" OnClick="JavaScript:uncheckParent(this,'CSPChkBx')" /></li>
                                <li><asp:CheckBox AutoPostBack="true" runat="server" ID="CSPTroughChkBx" Text="CSP - Trough" Checked="true" Value="35" OnClick="JavaScript:uncheckParent(this,'CSPChkBx')" /></li>
                                <li><asp:CheckBox AutoPostBack="true" runat="server" ID="CSPLensChkBx" Text="CSP - Lens" Checked="true" Value="36" OnClick="JavaScript:uncheckParent(this,'CSPChkBx')" /></li>
                                <li><asp:CheckBox AutoPostBack="true" runat="server" ID="CSPTowerChkBx" Text="CSP - Tower" Checked="true" Value="37" OnClick="JavaScript:uncheckParent(this,'CSPChkBx')" /></li>
                                <li><asp:CheckBox AutoPostBack="true" runat="server" ID="CSPDishEngineChkBx" Text="CSP - Dish Engine" Checked="true" Value="38" OnClick="JavaScript:uncheckParent(this,'CSPChkBx')" /></li>
                                <li><asp:CheckBox AutoPostBack="true" runat="server" ID="CSPLinearFresnelChkBx" Text="CSP - Linear Fresnel" Checked="true" Value="39" OnClick="JavaScript:uncheckParent(this,'CSPChkBx')" /></li>
                            </div>
                        </ul>
                    <li><asp:CheckBox AutoPostBack="true" runat="server" ID="GeothermalChkBx" Text="Geothermal" Checked="true" Value="8"/></li>
                    <li><asp:CheckBox AutoPostBack="true" runat="server" ID="HydroChkBx" Text="Hydro" Checked="true" Value="13"/></li>
                    <li><asp:CheckBox AutoPostBack="true" runat="server" ID="OceanChkBx" Text="Ocean" Checked="true" Value="9" OnClick="JavaScript:ParentCheck(parent, 'OceanChks')"/></li>
                        <ul>
                            <div runat="server" id="OceanChks">
                                <li><asp:CheckBox AutoPostBack="true" runat="server" ID="CheckBox1" Text="Ocean" Checked="true" Value="3" OnClick="JavaScript:uncheckParent(this,'OceanChkBx')"/></li>
                                <li><asp:CheckBox AutoPostBack="true" runat="server" ID="OceanWaveChkBx" Text="Ocean - Wave" Checked="true" Value="45" OnClick="JavaScript:uncheckParent(this,'OceanChkBx')" /></li>
                                <li><asp:CheckBox AutoPostBack="true" runat="server" ID="OceanTidalCurrentChkBx" Text="Ocean - Tidal/Current" Checked="true" Value="46" OnClick="JavaScript:uncheckParent(this,'OceanChkBx')" /></li>
                            </div>
                        </ul>
                    <li><asp:CheckBox AutoPostBack="true" runat="server" ID="SolarPVChkBx" Text="Solar PV" Checked="true" Value="10"/></li>
                    <li><asp:CheckBox AutoPostBack="true" runat="server" ID="WindChkBx" Text="Wind" Checked="true" Value="12" OnClick="JavaScript:ParentCheck(parent, 'WindChks')"/></li>   
                        <ul>
                            <div runat="server" id="WindChks">
                                <li><asp:CheckBox AutoPostBack="true" runat="server" ID="WindOnshoreChkBx" Text="Wind - Onshore" Checked="true" Value="6" OnClick="JavaScript:uncheckParent(this,'WindChkBx')" /></li>
                                <li><asp:CheckBox AutoPostBack="true" runat="server" ID="WindOffshoreChkBx" Text="Wind - Offshore" Checked="true" Value="21" OnClick="JavaScript:uncheckParent(this,'WindChkBx')" /></li>
                            </div>
                        </ul>                             
                </ul>
            </div>
        </div>
        <div runat="server" id="StatusDiv" class="filters">
                <span style="font-size:10pt;">Status:</span>
                <ul>
                    <li><asp:CheckBox AutoPostBack="true" runat="server" Value="1" ID="OperatingChkBx" Text="Operating" Checked="true" OnCheckedChanged="GenericFiltersChanged" /></li>
                    <li><asp:CheckBox AutoPostBack="true" runat="server" Value="2" ID="UnderConstructionChkBx" Text="Under Construction" Checked="true" OnCheckedChanged="GenericFiltersChanged" /></li>
                    <li><asp:CheckBox AutoPostBack="true" runat="server" Value="3" ID="PreConstructionChkBx" Text="Pre-Construction" Checked="true" OnCheckedChanged="GenericFiltersChanged" /></li>
                </ul>
            <br />
        </div>
    </ContentTemplate>
</asp:UpdatePanel>

「UncheckParent」機能は適切に機能していますが、親がチェックされている/チェックされていない場合、対応する div 内のすべてのチェックボックスをチェック済みの状態 (つまり、親がチェック済み、子がチェック済み、またはその逆) に変更する必要があります。

function uncheckParent(checkbox, parentcheckboxid) {
    var Parentcheckbox = document.getElementById(parentcheckboxid);

    if (!checkbox.checked) {
        Parentcheckbox.checked = false;
    }
}

function ParentCheck(parent, aId) {
    if (parent.checked == false) {
        checkByParent(aId, false);
        alert("false");
    }
    else if (parent.checked == true) {
        checkByParent(aId, true);
    }

}

function checkByParent(aId, aChecked) {
    var collection = document.getElementById(aId).getElementsByTagName('INPUT');
    for (var x = 0; x < collection.length; x++) {
        if (collection[x].type.toUpperCase() == 'CHECKBOX')
            collection[x].checked = aChecked;
    }

}

コード化されているように、この関数は常に、親チェックボックスのチェック済みプロパティ == false を返します。これは、その「false」アラート (デバッグのためにのみ存在する) によって証明されます。

親チェックボックスのcheckedプロパティのステータスに関係なく、これがfalseを返すのはなぜですか? すべてのチェックボックスから「Checked="true"」プロパティを削除して、それが問題であるかどうかを確認しようとしましたが、残念ながら、機能は同じままでした。

(最初はサーバー側でこのようにコーディングしていましたが、うまくいきましたが、ページを少し再配置してポストバックイベントを変更する必要があり、イベントハンドラーが起動する前にサーバーが Page_Load のチェック済みプロパティを読み取っていました。)

score 2 · Accepted Answer

1 つの行に焦点を当てますが、残りは同様です。
したがって、この行にはいくつかの主要な問題があります。

<asp:CheckBox AutoPostBack="true" runat="server" ID="CSPChkBx" Text="CSP" 
 Checked="true" Value="11" OnClick="JavaScript:ParentCheck(parent, 'CSPchks')" />

間違ったIDを送ります。ID を機能させるには、ClientID を asp.net 4 に static として配置するか、関数でthisキーワードを送信する必要がありますparent()
ポストバックを作成すると、何をしても消えてしまうため、JavaScript は機能しません。したがって、自動ポストバックを削除し、JavaScriptを削除します。
また、asp.net チェックコントロールは、スパンと共に入力をレンダリングします。そのため、onclick は入力コントロールではなくスパンを参照する可能性があるため、ソースコードを参照してどこに行くかを確認する必要があります。

したがって、ここでやりたいことを再設計する必要があります。

javascript - JavascriptがAsp Checkbox Checkedプロパティを認識しない

1 に答える 1

Related

Reference