问题描述:

Currently I have three RadioButtons:

<asp:RadioButton ID="rbShowAll" runat="server" CssClass="radio-inline" GroupName="grpReadStatus" onchange="disableDDL()"/>

<asp:RadioButton ID="rbIssuedTo" runat="server" CssClass="radio-inline" GroupName="grpReadStatus" onchange="disableDDL()"/>

<asp:RadioButton ID="rbReceivedFrom" runat="server" CssClass="radio-inline" GroupName="grpReadStatus" onchange="disableDDL()"/>

And two DropDownLists:

<asp:DropDownList ID="ddlBuyer" runat="server" class="form-control" />

<asp:DropDownList ID="ddlSeller" runat="server" class="form-control" />

How can I, without touching server side, disable the dropdownList according to which RadioButton is selected in Javascript function?

I have tried:

function disableDDL() {

if (document.getElementById("rbShowAll").checked) {

document.getElementById("ddlBuyer").disabled = true;

document.getElementById("ddlSeller").disabled = true;

}

else if (documne.getElementById("rbIssuedTo").checked) {

document.getElementById("ddlSeller").disabled = true;

}

else if (document.getElementById("rbReceivedFrom").checked) {

document.getElementById("ddlButer").disabled = true;

}

}

But it's not working. Can someone please advise on this? Help would be much appreciated. Thanks

网友答案:

I have created a working code snippet for you, There were plenty of typos and that's why it wasn't working, I have corrected them all :) have a look.

function disableDDL() {
  document.getElementById("ddlBuyer").disabled = false;
  document.getElementById("ddlSeller").disabled = false;
  if (document.getElementById("rbShowAll").checked) {
    //alert('rbShowAll');
    document.getElementById("ddlBuyer").disabled = true;
    document.getElementById("ddlSeller").disabled = true;
  } else if (document.getElementById("rbIssuedTo").checked) {
    //alert('rbIssuedTo');
    document.getElementById("ddlSeller").disabled = true;
  } else if (document.getElementById("rbReceivedFrom").checked) {
    //alert('rbReceivedFrom');
    document.getElementById("ddlBuyer").disabled = true;
  } //else {
  //alert('Else');
  //}
}
<input type="radio" id="rbShowAll" class="radio-inline" name="grpReadStatus" onchange="javascript:disableDDL()">Show all
<input type="radio" id="rbIssuedTo" class="radio-inline" name="grpReadStatus" onchange="javascript:disableDDL()">Issued to
<input type="radio" id="rbReceivedFrom" class="radio-inline" name="grpReadStatus" onchange="javascript:disableDDL()">Recieved from

<select id="ddlBuyer">
  <option>Select Buyer</option>
  <option>Buyer 1</option>
</select>

<select id="ddlSeller">
  <option>Select Seller</option>
  <option>Seller 1</option>
</select>
网友答案:

asp:RadioButton is rendered as a span element with the radio inside so the event onchage you put will be assigned to the span element and won't work. Instead use directly:

<input type="radio" 
       id="rbShowAll" runat="server"
       name="grpReadStatus" 
       class="radio-inline" 
       onchange="disableDDL()" />
网友答案:

Modify your html accordingly..

<input type="radio" id="rbShowAll" class="radio-inline" name="grpReadStatus" onchange="javascript:disableDDL()">Show all
<input type="radio" id="rbIssuedTo" class="radio-inline" name="grpReadStatus" onchange="javascript:disableDDL()">Issued to
<input type="radio" id="rbReceivedFrom" class="radio-inline" name="grpReadStatus" onchange="javascript:disableDDL()">Recieved from

<select id="ddlBuyer">
  <option>Select Buyer</option>
  <option>Buyer 1</option>
</select>

<select id="ddlSeller">
  <option>Select Seller</option>
  <option>Seller 1</option>
</select>

Modify your javascript function accordingly..

    function disableDDL() {
        if (document.getElementById("rbShowAll").checked) {
            document.getElementById("ddlBuyer").disabled = true;
            document.getElementById("ddlSeller").disabled = true;
        }
        else if (document.getElementById("rbIssuedTo").checked) {
            document.getElementById("ddlSeller").disabled = true;
            document.getElementById("ddlBuyer").disabled = false;
     }
else if (document.getElementById("rbReceivedFrom").checked) {
            document.getElementById("ddlSeller").disabled = false;
            document.getElementById("ddlBuyer").disabled = true;
}
相关阅读:
Top