The 4 FieldStateController controls (FieldStateController, MultiFieldStateController, FSCOnCommand, and MultiFSCOnCommand) monitor edits and clicks on any type of field on the page and change the appearance of other controls on the page.

The FieldStateController and MultiFieldStateController use the same Condition objects used by validators to select between one of two settings you define. For example, a checkbox toggles the visibility on a textbox by selecting the CheckStateCondition to monitor the checkbox and setting Visibility to hidden or visible depending on whether the CheckStateCondition evaluates as "success" (it matched the checkbox to the rules) or "failed" (no match).

The FieldStateController toggles the state of one control. The MultiFieldStateController toggles the state of multiple controls.

The FSCOnCommand and MultiFSCOnCommand make a single state change, each time you click on a button. For example, click the Select All button to mark all checkboxes in a CheckBoxList control.

The FSCOnCommand control changes the state of one control. The MultiFSCOnCommand control changes the state of multiple controls.

These controls can modify almost any attribute or style on almost any element of the page. Its properties quickly let you modify these attributes:

• Visibility
• Enabled
• Style Sheet Class Name
• URL to images and HREF to links.
• ReadOnly
• The 'value' attribute of a form control like a textbox or button.
• The 'innerHTML' attribute of most non-form fields such as the text within a <span> tag.
• The check state on a CheckBox, RadioButton, or all checkboxes in a CheckBoxList.

In addition, you can specify the DHTML or DOM name of any attribute or style of a control and supply a new value. For example, you can change the selected index of a DropDownList by identifying its property name of 'selectedIndex' and the new index value ('0', '1', '2', etc.).

Demos 1 through 6 have a checkbox that when clicked, changes the state of the field to its right. Each uses a FieldStateController that employs the CheckStateCondition to detect when you click on the checkbox and the state of the attribute to set.

Demo 7 shows the FSCOnCommand control.

Demo 1 - Visibility

Textbox is visible when checked

ASP.NET Syntax for this demo

<asp:CheckBox id="CheckBox1" runat="server" Text="Textbox is visible when checked"/>
<asp:TextBox id="TextBox1" runat="server" />
<des:FieldStateController id="FieldStateController1" runat="server"
   ControlIDToChange="TextBox1" ConditionFalse-Visible="False">
   <ConditionContainer>
      <des:CheckStateCondition ControlIDToEvaluate="CheckBox1" />
   </ConditionContainer>
</des:FieldStateController>

Demo 2 - Enabled

Textbox is enabled when checked

ASP.NET Syntax for this demo

<asp:CheckBox id="CheckBox2" runat="server" Text="Textbox is enabled when checked"/>
<asp:TextBox id="TextBox2" runat="server" Text="abc" />
<des:FieldStateController id="FieldStateController2" runat="server"
   ControlIDToChange="TextBox2" ConditionFalse-Enabled="False" >
   <ConditionContainer>
      <des:CheckStateCondition ControlIDToEvaluate="CheckBox2" />
   </ConditionContainer>
</des:FieldStateController>

Demo 3 - Style Sheet Class Name

Label has a colored background when checked    This is the Label

ASP.NET Syntax for this demo

<asp:CheckBox id="CheckBox3" runat="server" Text="Label has a colored background when checked"/>
<asp:Label id="Label1" runat="server"></asp:Label>
<des:FieldStateController id="FieldStateController1" runat="server"
   ControlIDToChange="Label1" ConditionTrue-CssClass="DESVALFieldWithError">
   <ConditionContainer>
      <des:CheckStateCondition ControlIDToEvaluate="CheckBox3" />
   </ConditionContainer>
</des:FieldStateController>

Demo 4 - URLs

The Image and Link URL will change    Go to Search Engine

ASP.NET Syntax for this demo

<asp:checkbox id="Checkbox4" runat="server" Text="The Image and Link URL will change" />
<asp:Image id="Image1" runat="server" ImageUrl="~/Images/YahooLogo.gif" />
   <asp:HyperLink id="HyperLink1" runat="server" NavigateUrl="http://www.yahoo.com" >
Go to Search Engine</asp:HyperLink>
<des:FieldStateController id="Fieldstatecontroller4" runat="server"
   ControlIDToChange="Image1" ConditionTrue-URL="~/Images/GoogleLogo.gif">
   <ConditionContainer>
      <des:CheckStateCondition ControlIDToEvaluate="Checkbox4" />
   </ConditionContainer>
</des:FieldStateController>
<des:FieldStateController id="FieldStateController5" runat="server"
   ControlIDToChange="HyperLink1" ConditionTrue-URL="http://www.Google.com">
   <ConditionContainer>
       <des:CheckStateCondition ControlIDToEvaluate="Checkbox4" />
   </ConditionContainer>
</des:FieldStateController>

Demo 5 - Form field value

Button's label changes

ASP.NET Syntax for this demo

<asp:CheckBox id="CheckBox5" runat="server" Text="Button's label changes"/>
<asp:Button id="Button1" runat="server"></asp:Button>
<des:FieldStateController id="FieldStateController6" runat="server"
   ControlIDToChange="Button1" ConditionTrue-FieldValue="Cancel">
   <ConditionContainer>
      <des:CheckStateCondition ControlIDToEvaluate="CheckBox5" />
   </ConditionContainer>
</des:FieldStateController>

Demo 6 - innerHTML

Label's text changes    Original Label

ASP.NET Syntax for this demo

<asp:CheckBox id="CheckBox6" runat="server" Text="Label's text changes"/>
 <asp:Label id="Label2" runat="server"></asp:Label>
 <des:FieldStateController id="FieldStateController7" runat="server"
    ControlIDToChange="Label2" ConditionTrue-InnerHTML="&lt;b&gt;Changed&lt;/b&gt; Label">
    <ConditionContainer>
       <des:CheckStateCondition ControlIDToEvaluate="CheckBox6" />
    </ConditionContainer>
 </des:FieldStateController>

Demo 7 - FSCOnCommand

The Select All button will mark all checkboxes. The Clear All button will unmark all checkboxes. The checkboxes are from a CheckBoxList control. Both buttons use <input type='button'> so they do not submit when clicked.

 

Pizza

Fish

Steak

Lobster

ASP.NET Syntax for this demo

<input type=button id="SelectAllBtn" runat=server value='Select All' > 
<input type=button id="ClearAllBtn" runat=server value='Clear All' ><br>
<asp:CheckBoxList ID="Checkboxlist1" Runat=server>
   <asp:ListItem Value="Pizza">Pizza</asp:ListItem>
   <asp:ListItem Value="Fish">Fish</asp:ListItem>
   <asp:ListItem Value="Steak">Steak</asp:ListItem>
   <asp:ListItem Value="Lobster">Lobster</asp:ListItem>
</asp:CheckBoxList><br>
<des:FSCOnCommand id="FSCOnCommand1" runat="server" 
  ControlIDToChange="CheckBoxList1" ControlIDToRunThisAction="SelectAllBtn" Checked="True">
</des:FSCOnCommand>
<des:FSCOnCommand id="FSCOnCommand2" runat="server"
   ControlIDToChange="CheckBoxList1" ControlIDToRunThisAction="ClearAllBtn" Checked="False">
</des:FSCOnCommand>