Why isn't this simple javascript working?

This javascript all but works with exception of radiobuttonlist.

<script language="javascript" type="text/javascript">
function validate() {
    if (document.getElementById("<%=txtballotName.ClientID%>").value == "") {
        alert("Ballot Name can not be blank");
        document.getElementById("<%=txtballotName.ClientID%>").focus();
        return false;
    }

    if (document.getElementById("<%=txtballotCity.ClientID %>").value == "") {
        alert("Ballot City can not be blank");
        document.getElementById("<%=txtballotCity.ClientID %>").focus();
        return false;
    }
    if (document.getElementById("<%=txtballotState.ClientID%>").value == "") {
        alert("Ballot State cannot be blank");
        document.getElementById("<%=txtballotState.ClientID%>").focus();
        return false;
    }
    if (document.getElementById("<%=txtballotZip.ClientID%>").value == "") {
        alert("Zip Code cannot be blank");
        document.getElementById("<%=txtballotZip.ClientID%>").focus();
        return false;
    }
        if (document.getElementById("<%= txtreceivedby.ClientID %>").checked == false) {
        alert("Request Received By can not be blank");
        document.getElementById("<%=txtreceivedby.ClientID%>").focus();
        return false;
    }

     return true;
}

The radiobuttonList looks like this:

<tr>
    <td>
        <label for="txtreceivedby_0">FAX</label>
        <input id="txtreceivedby_0" type="radio" name="txtreceivedby" value="Fax" />
    </td>
    <td>
        <label for="txtreceivedby_1">EMAIL</label>
        <input id="txtreceivedby_1" type="radio" name="txtreceivedby" value="Mail" />
    </td>
    <td>
        <label for="txtreceivedby_2">PHONE</label>
        <input id="txtreceivedby_2" type="radio" name="txtreceivedby" value="Phone" />
    </td>
</tr>

So far, the other form field are validating except the txtreceivedby radio button. I am not getting any errors but it isn't validating either. Thanks in advance

Answers


ASP's radiobuttonlist render as a table containing radio button items. Therefore, it is a bit complicated to get the checked status of radio button.

You might find various sources if you google for "ASP radiobuttonlist and javascript". I have tested some of them and not every of them worked well specially if your page created from Master page.

However, I have tried in my own way and here it is:

<asp:RadioButtonList ID="txtReceivedBy" runat="server">
    <asp:ListItem Text="Fax" Value="0"></asp:ListItem>
    <asp:ListItem Text="Email" Value="1"></asp:ListItem>
    <asp:ListItem Text="Phon" Value="2"></asp:ListItem>
</asp:RadioButtonList>
<input type="button" onclick="alert(checkedRadio());" value="Test RadioButtonChecked Status" />

and the javascript I have used to get the cehcked status is here

function checkedRadio() {
    var rtn = false;
    var i = 0;
    var radioBoxesContainer = document.getElementById("<%=txtReceivedBy.ClientID%>");
    if (radioBoxesContainer) {
        var radioBoxes = radioBoxesContainer.getElementsByTagName("input");
        if (radioBoxes && radioBoxes.length > 0) {
            for (i - 0; i < radioBoxes.length; i++) {
                if (radioBoxes[i].checked) {
                    rtn = true;
                    break;
                }
            }
        }
    }
    return rtn;
}

if you are interested to get a live demo, you can find it here http://plugins.amiwithyou.com/sof/


You can create a short little utility function that will get you the value of any radio group:

function getRadioValue(name) {
    var items = document.getElementsByName(name);
    for (var i = 0; i < items.length; i++) {
        if (items[i].checked) {
            return(items[i].value);
        }
    }
}

You can then get the checked item in your radio group like this:

var val = getRadioValue("txtreceivedby");

Working Demo: http://jsfiddle.net/jfriend00/PHXaC/


In a nutshell major headache; if you'd page me, I'd go with a nice good ol' fashion <select> box.

But to be useful, you need to have a look with view source at exactly what the ASP code plasts out to the browser. I don't know ASP but I bet it's either outputting 3 different ids on each radio, or the same id (#txtreceivedby) on all three of them.

Whatever it gives out, the validation code if(bla_bla_blah.checked===false) is wrong because it only targets just one in the set of radios and even with that fixed, that radio might not return .checked===false cross-browser.


Need Your Help

Why is boost::hana's set not default constructable?

c++ boost c++14 template-meta-programming boost-hana

today I found that boost::hana's map and set aren't default constructable, while the tuple is. Is there any particular reason for this because it is quite annoying.

Apache - finding configuration file path

windows apache server

I have to migrate another apache instance from 2.2 to 2.4 but I have one problem.