disable button until value selected : The Official Microsoft ASP.NET Forums

Reply

disable button until value selected

Feb 09, 2013 06:03 PM|LINK

Drop Down:

<asp:DropDownList ID="DropDownListSubContractors" runat="server" AppendDataBoundItems="true" DataTextField="Company_Name" DataValueField="id">
  <asp:ListItem Text="---Select---" Value="0" />
</asp:DropDownList>

Button:

 <asp:Button ID="addNewSubContractor" Text="Add Sub Contractor" OnClick="UploadSubContractor" runat="server" />

I want to disable the button until a value is selected from the drop down.

Does anyone know how to do this?

Thanks in advance

Reply

Re: disable button until value selected

Feb 09, 2013 06:21 PM|LINK

hai

try this

<asp:DropDownList ID="DropDownListSubContractors" AutoPotBack="True" runat="server" AppendDataBoundItems="true" DataTextField="Company_Name" DataValueField="id">
  <asp:ListItem Text="---Select---" Value="0" />
</asp:DropDownList>

code behind

Page_Load()

if(DropDownListSubContractors.SelectedValue="0")

addNewSubContractor.Enabled = false;

Reply

Re: disable button until value selected

Feb 09, 2013 06:22 PM|LINK

You can easily handle this using Javascript by just changing the disabled property of your button using the following function :

<script type="text/javascript">
    function selectChanged() {
        document.getElementById("addNewSubContractor").disabled = "";
    }
</script>

which would be called by adding the following onchange property to your DropDownList :

<asp:DropDownList ID="DropDownListSubContractors" runat="server" AppendDataBoundItems="true" DataTextField="Company_Name" DataValueField="id" onchange='selectChanged();'>

If you wanted to enable it ONLY if the selected index was not your first option, use :

<script type="text/javascript">
    function selectChanged(element) {
        document.getElementById("addNewSubContractor").disabled = (element.selectedIndex == 0) ? "disabled" : "";
    }
</script>

by changing your onchange call to this :

onchange='selectChanged(this);'

Example

Blog | Twitter | Stack Overflow | LinkedIn

Edited by Rion Williams on Feb 09, 2013 06:25 PM

Reply

Re: disable button until value selected

Feb 09, 2013 06:33 PM|LINK

hi ,

you can make button enable false

<asp:Button ID="addNewSubContractor" Text="Add Sub Contractor" Enabled ="false"  OnClick="UploadSubContractor" runat="server" />

and write down code on selectedindex change of dropdown

<asp:DropDownList ID="DropDownListSubContractors" runat="server"  
        AppendDataBoundItems="true" DataTextField="Company_Name" DataValueField="id" 
        onselectedindexchanged="DropDownListSubContractors_SelectedIndexChanged">
  <asp:ListItem Text="---Select---" Value="0" />
</asp:DropDownList>

 protected void DropDownListSubContractors_SelectedIndexChanged(object sender, EventArgs e)
        {
            if (DropDownListSubContractors.SelectedItem.Value == "0")
                addNewSubContractor.Enabled = false;
            else
                addNewSubContractor.Enabled = true;
        }

Reply

Re: disable button until value selected

Feb 09, 2013 06:34 PM|LINK

assuming that you are using JQuery in your application, here is a solution to achieve your scenario:

<script type="text/javascript">
$(document).ready(function()
                  {
                      $("#dropDownListContractors").change(function(){
                          var button = $("#addNewSubContractors");
                          var selValue = $(this).val();
                          if(selValue == -1)
                          {
                              button.attr('disabled','disabled');
                          }
                          else
                          {
                              button.removeAttr('disabled');
                          }
                      });
                  });
</script>

Here is a live demo of the above scenario:

http://jsfiddle.net/kashyapa/rgpgK/

Lohith G N
http://about.me/kashyapa

Reply

Re: disable button until value selected

Feb 09, 2013 06:39 PM|LINK

thanks for reply but it doesnt work

<td>
                             <asp:DropDownList ID="DropDownListSubContractors" onchange='selectChanged()'  runat="server" AppendDataBoundItems="true" DataTextField="Company_Name" DataValueField="id">
                                   <asp:ListItem Text="---Select---" Value="0" />
                             </asp:DropDownList>

                             <script type="text/javascript">
                                 function selectChanged()
                                 {
                                     document.getElementById("addNewSubContractor").disabled = "";
                                 }
                                    </script>
                        </td>

Reply

Re: disable button until value selected

Feb 09, 2013 06:43 PM|LINK

You may need to pull the proper ClientID property so that you can access it it within your Javascript using code blocks :

document.getElementById('<%= addNewSubContractor.ClientID %>').disabled = (element.selectedIndex == 0) ? "disabled" : "";

In order for the change event to be fired as well, you will likely need another ListItem within your DropDownList so that you can easily change that (unless you are adding it dynamically).

Full Code below :

<script type="text/javascript">
    function selectChanged(element) {
        document.getElementById('<%= addNewSubContractor.ClientID %>').disabled = (element.selectedIndex == 0) ? "disabled" : "";    }
</script>
<body>
    <form id="form1" runat="server">
    <asp:DropDownList ID="DropDownListSubContractors" runat="server" AppendDataBoundItems="true" DataTextField="Company_Name" DataValueField="id" onchange='selectChanged(this);'>
      <asp:ListItem Text="---Select---" Value="0" />
      <asp:ListItem Text="Option 1" Value="1" />
    </asp:DropDownList>
    <asp:Button ID="addNewSubContractor" Text="Add Sub Contractor" runat="server" disabled='disabled' />
    </form>
</body>

Blog | Twitter | Stack Overflow | LinkedIn

Edited by Rion Williams on Feb 09, 2013 06:44 PM
Edited by Rion Williams on Feb 09, 2013 06:45 PM

Reply

Re: disable button until value selected

Feb 09, 2013 06:57 PM|LINK

thank you i pasted your code in and it works fine....

however ---select--- is no longer the first item in the drop down even though I am still using

<asp:ListItem Text="---Select---" Value="0" />

Reply

Re: disable button until value selected

Feb 09, 2013 07:15 PM|LINK

Are you dynamically adding List Items to your DropDownList? If so, you may want to consider adding this one the same way or using the value of the selected index to determine if your button should be disabled or not, like so :

function selectChanged(e) {
        document.getElementById("<%= addNewSubContractor.ClientID %>").disabled = (e.options[e.selectedIndex].value == "0") ? "disabled" : "";
}

Example

Blog | Twitter | Stack Overflow | LinkedIn

Edited by Rion Williams on Feb 09, 2013 09:13 PM
Edited by Rion Williams on Feb 09, 2013 09:13 PM

Reply

oned_gk

All-Star

31543 Points

6442 Posts

Re: disable button until value selected

Feb 10, 2013 12:26 AM|LINK

<asp:Button ID="addNewSubContractor"
Text="Add Sub Contractor"
OnClick="UploadSubContractor" runat="server"
Enabled="False" />

set the button enabled="false" and ddl autopostbak

    <asp:DropDownList ID="DropDownListSubContractors" runat="server" 
       AppendDataBoundItems="true" 
       DataTextField="Company_Name" 
       DataValueField="id" AutoPostback="True"
       onselectedindexchanged="DropDownListSubContractors_SelectedIndexChanged">
      <asp:ListItem Text="---Select---" Value="0" />
      <asp:ListItem Text="Option 1" Value="1" />
    </asp:DropDownList>

and set ddl autopostback. Then in ddl selectedindexchanged event check if ddl.selectedindex==0 then set btn enable false else true.

    protected void DropDownListSubContractors_SelectedIndexChanged(object sender, EventArgs e)
    {
        if (DropDownListSubContractors.SelectedIndex == 0)
        {
            addNewSubContractor.Enabled = false;
        }
        else
        {
            addNewSubContractor.Enabled = true;
        }
    }

Programming to simplify, dont look for hard way

Edited by oned_gk on Feb 10, 2013 01:54 AM
Edited by oned_gk on Feb 10, 2013 05:28 AM
Edited by oned_gk on Feb 10, 2013 05:37 AM

disable button until value selected RSS

13 replies

xna4life

disable button until value selected

rameps

Re: disable button until value selected

Rion William...

Re: disable button until value selected

Nilu87

Re: disable button until value selected

kashyapa

Re: disable button until value selected

xna4life

Re: disable button until value selected

Rion William...

Re: disable button until value selected

xna4life

Re: disable button until value selected

Rion William...

Re: disable button until value selected

oned_gk

Re: disable button until value selected

This site is managed for Microsoft by Neudesic, LLC. | © 2013 Microsoft. All rights reserved.

Follow Us On:

Microsoft