How to enable-disable a field based on a value selected in another tab

Page 1 of 1

1 Replies - 423 Views - Last Post: 17 July 2012 - 11:56 AM

#1 rup_nab  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 10
  • Joined: 18-June 12

How to enable-disable a field based on a value selected in another tab

Posted 17 July 2012 - 10:06 AM

I have two tab-panels..Each tabpanel has a usercontrol.

Main Page

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="asp" %>

<%@ Register src="WebUserControl.ascx" tagname="ucA" tagprefix="uc1" %>

<%@ Register src="WebUserControl2.ascx" tagname="ucB" tagprefix="uc2" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        table
        {
          background:Cornsilk;
         }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    
        
    
        <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
        </asp:ToolkitScriptManager>
        <asp:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="1">
            <asp:TabPanel runat="server" HeaderText="TabPanel1" ID="TabPanel1">
            <ContentTemplate>
              <uc1:ucA ID="ucA1" runat="server" />
            </ContentTemplate>
            </asp:TabPanel>
            <asp:TabPanel ID="TabPanel2" runat="server" HeaderText="TabPanel2">
            <ContentTemplate>
            <uc2:ucB ID="ucB1" runat="server" />
            </ContentTemplate>
            </asp:TabPanel>
</asp:TabContainer>
        
        <br />
        
        <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Save" />
        
        <br />
    
    </div>
    </form>
</body>
</html>

1st User control

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="WebUserControl.ascx.cs" Inherits="WebUserControl" %>
<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="asp" %>
<style type="text/css">
    .style1
    {
        width: 100%;
    }
    .CenterTextBox {

text-align:right;
}
</style>
<table class="style1">
    <tr>
        <td>
            Name</td>
        <td>
            <asp:TextBox ID="TextBox1" runat="server" ClientIDMode="Static"></asp:TextBox>

        </td>
    </tr>
    <tr>
        <td>
            &nbsp;</td>
        <td>
            &nbsp;</td>
    </tr>
    <tr>
        <td>
            Age</td>
        <td>
            <asp:TextBox ID="TextBox2" runat="server" ClientIDMode="Static"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td>
            &nbsp;</td>
        <td>
            &nbsp;</td>
    </tr>
    <tr>
        <td>
            Member?</td>
        <td>
            <asp:DropDownList ID="DropDownList1" runat="server">
                <asp:ListItem>Yes</asp:ListItem>
                <asp:ListItem>No</asp:ListItem>
            </asp:DropDownList>
        </td>
    </tr>
    <tr>
        <td>
            &nbsp;</td>
        <td>
            &nbsp;</td>
    </tr>
</table>


2nd User Control

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="WebUserControl2.ascx.cs" Inherits="WebUserControl2" %>
<style type="text/css">
    .style1
    {
        width: 100%;
    }
</style>
<table class="style1">
    <tr>
        <td>
            Location</td>
        <td>
            <asp:TextBox ID="TextBox1" runat="server" ClientIDMode="Static"></asp:TextBox>

        </td>
    </tr>
    <tr>
        <td>
            &nbsp;</td>
        <td>
            &nbsp;</td>
    </tr>
    <tr>
        <td>
            Dept</td>
        <td>
            <asp:TextBox ID="TextBox2" runat="server" ClientIDMode="Static"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td>
            Enter Membership Detail</td>
        <td>
            <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
        </td>
    </tr>
    <tr>
        <td>
            &nbsp;</td>
        <td>
            &nbsp;</td>
    </tr>
</table>

The requirement is if I select "No" from Member dropdownlist in 1st tabpanel,then textbox for "Enter Membership Detail" in 2nd tabpanel should be disabled.How can I acheive this without using session variable?

Is This A Good Question/Topic? 0
  • +

Replies To: How to enable-disable a field based on a value selected in another tab

#2 Martyr2  Icon User is offline

  • Programming Theoretician
  • member icon

Reputation: 3872
  • View blog
  • Posts: 11,405
  • Joined: 18-April 07

Re: How to enable-disable a field based on a value selected in another tab

Posted 17 July 2012 - 11:56 AM

Well you are showing the aspx versions here, but most of what you need to know is in the code behind files of your user controls. There are classes behind them and typically you can access the controls in the user control just like you would access instances of objects.

We don't want one control reaching right into another control to manipulate a textbox. Instead we would define a public accessor property or method that will then access that textbox in the control on behalf of any other controls or code that wishes to modify it.

One method that may work here is to create an event which user control 2 will subscribe to the event triggered in user control 1. That way when the user drop down is triggered on the first, it fires the event and the other control will respond (because it is listening for the event) and edit its own controls.

This method is useful in that it will allow many controls to listen to one control for changes.

Hopefully that helps. :)

This post has been edited by Martyr2: 17 July 2012 - 12:18 PM

Was This Post Helpful? 0
  • +
  • -
Page 1 of 1