简体   繁体   中英

Disable Radio Buttons If Table Value Is 1 or more

I have a web page which has a set of radio buttons on (Yes & No) when 'Yes' is selected, a hidden <div> is displayed. The user then populates the fields and clicks an 'Add' button this then displays in a table.

This table also has a 'Remove' link. I want the 'No' radio button to become 'Disabled' when the table has 1 or more entries in it and then ONLY be re-enabled when the table is empty by using the 'Remove' link.

I want to do this in JavaScript as I already have some on the page which currently does disable/enable functionality onclick .

The disabling of the 'No' radio button needs to be done when the table is populated and not on an onclick .

Current JavaScript

    <script language="javascript" type="text/javascript">
    SetFocus("<%: ViewData["SetFocus"]%>");

    function CheckRadioOptions(obj, layers, showValue) {
        if (obj == document.getElementById("CTFYes")) {
            document.getElementById("Transfer").style.display = "none";
            document.getElementById("CTF").style.display = "block";
        }
        else {
            document.getElementById("Transfer").style.display = "block";
            document.getElementById("CTF").style.display = "none";
        }

        if (obj != null) {
            var value = "";
            for (var i = 0; i < obj.length; i++) { if (obj[i].checked) { value = obj[i].value; } }
            if (value == "") { value = obj.value; }
            if (value == showValue) { HideLayers(layers); } else { ShowLayers(layers); }
        }

    }

    window.onload = oneSelection();

    function oneSelection() {
        if (document.getElementById("TranYes").checked == true) {
            document.getElementById("CTFYes").disabled = true;
            document.getElementById("CTFYes").title = "This option has been disabled. You can re-enable it by selecting ‘No’ to the question above.";
            document.getElementById("CTFNo").checked = true;
        }
        if (document.getElementById("CTFYes").checked == true) {
            document.getElementById("TranYes").disabled = true;
            document.getElementById("TranYes").title = "This option has been disabled. You can re-enable it by selecting ‘No’ to the question below.";
            document.getElementById("TranNo").checked = true;
        }
        if (document.getElementById("TranNo").checked == true) {
            document.getElementById("CTFYes").disabled = false;
            document.getElementById("CTFYes").title = ""
        }
        if (document.getElementById("CTFNo").checked == true) {
            document.getElementById("TranYes").disabled = false;
            document.getElementById("TranYes").title = ""
        }
    }

    if ("<%=ViewData["CTF_Yes"].Equals(true)%>" == "True") {
        document.getElementById("Transfer").style.display = "none";
        document.getElementById("CTF").style.display = "block";
    }
    else {
        document.getElementById("Transfer").style.display = "block";
        document.getElementById("CTF").style.display = "none";
    }
</script>

Table HTML only

<table class="table table-hover" id="transfertable" name="transfertable">
                <tr>
                    <th>Provider</th>
                    <th>Reference</th>
                    <th class="text-center">Approx. value</th>
                    <th>Action</th>
                </tr>
                <% 
                    Int32 c = 0;
                    foreach (AJBG.Web.Services.Entities.Client.Application.Products.IsaTransfer t in ISATransfers)
                    {
                       c++;
                 %>
                    <tr>
                        <td><%: Functions.Truncate(t.Manager, 10)%></td>
                        <td><%: Functions.Truncate(t.AccountNumber, 10) %></td>
                        <td class="text-right"><%: String.Format("{0:c}",t.ApproximateValue) %></td>
                        <td><a href="<%: Request.FilePath %>?id=<%: t.Identifier %>">Remove</a></td>
                    </tr>
                <% } %>
            </table>

找到了答案。

if (document.getElementById("[TABLE_ID]").getElementsByTagName("tr").length >= 1)

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM