For some reason none of these DIVs render disabled. Oddly enough, when I set Enabled="False" on the .NET Panel, then it renders the Panel as a DIV with disabled="disabled", which works great.
Here's my doctype:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<div id="Div1" disabled="disabled">
<input type="text" value="blah" />
</div>
<div id="disableMe" disabled="disabled">
<input type="text" value="blah" />
<asp:Panel runat="server">
<asp:RadioButtonList runat="server">
<asp:ListItem Text="Item1" Selected="True" />
<asp:ListItem Text="Item2" />
</asp:RadioButtonList>
<asp:TextBox runat="server" Text="Hello World" />
</asp:Panel>
</div>
Disabled is not an attribute for a DIV, but an attribute for every form element (like INPUT, SELECT, TEXTAREA).
Just add the disabled attribute to ever form element within the DIV.
I guess the disabled="disabled" gets parsed server side and applies that status to children fields (runat="server"), because in html there's no disabled="disabled" for <div> elements.
You basically want to use CSS display: none here.
<div style="display: none;">
A <div> is a simple HTML element and get printed to HTTP response as-is, it's not some server side component which generates some HTML (like as those other ASP.NET components are doing).
Related
I am using an ASP.NET Wizard control to display a multi steps process. I have to make the form accessible with NVDA screen reader and with all browsers. The form is accessible in Chrome as the NVDA is reading the screen from the top This is header to bottom in order. But when checking the same form in Firefox + NVDA, the focus is sometimes moving to middle and sometimes to the footer. My requirement is screen reader should always read from the This is header in all the wizard steps. Please, I need your help to solve the issue. My Code is as below:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WizardRadioButtonListDemo.Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Accessibile Form</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Wizard ID="Wizard1" runat="server" DisplaySideBar="false">
<HeaderTemplate>
<h1>This is header</h1>
</HeaderTemplate>
<WizardSteps>
<asp:WizardStep ID="WizardStep1" runat="server" Title="Step 1">
<fieldset id="Fieldset1" runat="server">
<legend id="Legend1" runat="server">Type</legend>
<asp:RadioButtonList ID="rdoServiceType" RepeatLayout="Flow" runat="server">
<asp:ListItem Text="Gold" Value="0">Gold</asp:ListItem>
<asp:ListItem Text="Siver" Value="1">Silver</asp:ListItem>
<asp:ListItem Text="Premium" Value="2">Premium</asp:ListItem>
</asp:RadioButtonList>
</fieldset>
</asp:WizardStep>
<asp:WizardStep>
<asp:FileUpload ID="FileUpload1" runat="server" />
<asp:Button ID="btnFileUpload" runat="server" Text="Upload" />
</asp:WizardStep>
<asp:WizardStep ID="WizardStep2" runat="server" Title="Step 2">
<fieldset id="Fieldset2" runat="server">
<legend id="Legend2" runat="server">User</legend>
<asp:Label ID="lblFirstName" runat="server" Text="First Name" AssociatedControlID="txtFirstName"></asp:Label>
<asp:TextBox ID="txtFirstName" runat="server"></asp:TextBox>
<asp:Label ID="lblLastName" runat="server" Text="Last Name" AssociatedControlID="txtLastName"></asp:Label>
<asp:TextBox ID="txtLastName" runat="server"></asp:TextBox>
</fieldset>
</asp:WizardStep>
</WizardSteps>
</asp:Wizard>
</div>
</form>
<p>© 2017 Test LLC.. All rights reserved. Powered by Test</p>
</body>
</html>
Okay so heres the issue I think. So you want the user to read the h1 by tabbing. One solution would be to add a tab-index of 0 to the header.
Why?
Because by default html, the only tabbable elements are Links, buttons, & inputs. H1's and p-tags don't do that. But they can if you give them a tab-index of 0...
So add this:
<HeaderTemplate tabindex="0">
<h1>This is header</h1>
</HeaderTemplate>
I might've interpreted your question wrong. If that's not the case, you can always add tab-index of positive values to your form in the sections you want it to go to.
Such as:tab-index="1"
... etc, and keep going up.
I have the following aspx code fragment. In the IE9 standard mode, even there is nothing to the left of the 1st listLabel, the 1st listLabel would still flush to the right and forces down one line for the remaining listLabels and their ListBoxes. In IE9 compatibility view mode, all listLabels and ListBoxes are on the same line. I tried many css settings without success. I prefer not to use float. Does anyone know why this is happening and how to fix the problem? Thanks.
label.listLable
{
/*vertical-align:top;*/
font-weight:bold;
}
<asp:Content ID="pageContent" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<div>
<div>
<label for="<%=listPcpPanel.ClientID%>" class="listLable">Panel: </label>
<asp:ListBox ID="listPcpPanel" runat="server" SelectionMode="Multiple" Rows="1">
<asp:ListItem Value="<----- All ----->" Selected="True"></asp:ListItem>
</asp:ListBox>
<label for="<%=listFacilityService.ClientID%>" class="listLable">Service: </label>
<asp:ListBox ID="listFacilityService" runat="server" SelectionMode="Single" Visible="true" Rows="1">
<asp:ListItem Value="<---Select one--->" Selected="True"></asp:ListItem>
</asp:ListBox>
<label for="<%=listRole.ClientID%>" class="listLable">Role: </label>
<asp:ListBox ID="listRole" runat="server" SelectionMode="Multiple" Visible="true" Rows="1">
<asp:ListItem Value="<----- All ----->" Selected="True"></asp:ListItem>
</asp:ListBox>
</div>
...
...
</div>
</asp:Content>
I got it resolved by removing the first <div> child of the <asp:content>.
I have a checkboxlist in ASP.net with several choices in it. Is there a way that I can make the physical check able box invisible? I want it so that only the item in question is visible, but the box is invisible. If this is not possible can somebody recommend an alternate ASP control that would behave similarly to the checkboxlist?
For example I have a checkboxlist such as this:
<asp:CheckBoxList ID="Example" runat="server" AutoPostBack="false" RepeatColumns="2" RepeatDirection="Horizontal">
<asp:ListItem> 1 </asp:ListItem>
<asp:ListItem> 2 </asp:ListItem>
<asp:ListItem> 3 </asp:ListItem>
<asp:ListItem> 4 </asp:ListItem>
<asp:ListItem> 5 </asp:ListItem>
</asp:CheckBoxList>
Now I want only the number to be visible and selectable, but I want to the checkbox to be invisible. Much like the way a button works but I feel as though creating x amount of buttons may be more tedious.
As per the answer I have tried the demo Jquery and came out with this:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Test.aspx.cs" Inherits="Testjq.Test" %>
<!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">
<script type = "text/javascript" src ="Scripts/jquery-1.7.1.min.js"></script>
<script type = "text/javascript" src ="Scripts/jquery-ui-1.8.18.custom.min.js"></script>
<script>
$(function () {
$("#check").button();
$("#format").buttonset();
});
</script>
<style>
#format { margin-top: 2em; }
</style>
<title></title>
</head>
<body>
<div class="demo">
<input type="checkbox" id="check" /><label for="check">Toggle</label>
<div id="format">
<input type="checkbox" id="check1" /><label for="check1">B</label>
<input type="checkbox" id="check2" /><label for="check2">I</label>
<input type="checkbox" id="check3" /><label for="check3">U</label>
</div>
</div><!-- End demo -->
</body>
</html>
Unfortunatley I still cannot get it to work. Any additional help would be much appreciated.
Did you check the jQueryUI?
Take a look at the demo page: http://jqueryui.com/demos/button/#checkbox
If I understood well they have exactly what you are looking for.
Here the textbox with id as "a" retains the value after postbacks while textbox with id as "b" not retains the value.Why this happens?
<form id="form1" runat="server">
<div>
<asp:TextBox ID="a" runat="server" AutoPostBack="true" ></asp:TextBox>
<form action="javascript:myFunc();">
<p>
<input type="text" id="city-field" name="city" " />
<input type="submit" value="Find" /></p>
</form>
</div>
<asp:TextBox ID="b" runat="server" AutoPostBack="true" ></asp:TextBox>
</form>
HTML does not support nested <form> tags.
The browser drops the inner <form>, then uses the inner </form> to close the outer <form>.
Therefore, the second textbox never gets posted back.
You can see this in Firebug.
tested on: windows server 2008 with visual studio 2010 and windows vista with visual studio 2008.
following unusuall problem has appeared.
i have a usercontrol and website where control will be showed.
if im checking radio buttons of control and clicking on submit which is also in ctrol inside there happens nothing. no request to server, just silence.
everything looks fine and standard but i cant find a problem. please help, because its annoying!
usercontrol.ascx:
<%# Control Language="C#" AutoEventWireup="true" CodeBehind="EmployeeCategorizationControl.ascx.cs"
Inherits="EmployeeCategorizationControl.EmployeeCategorizationControl" %>
<div id="categorizationOfEmployee">
<div>Categorization od Employee</div><br />
<div id="firstCategory">
<div style="float: left; width: 250px;">
Is not a permanent employee</div>
<div>
<asp:RadioButtonList ID="YesNoIsNotPermanentEmployee" runat="server" RepeatDirection="Horizontal">
<asp:ListItem Text="Yes" Value="1"></asp:ListItem>
<asp:ListItem Text="No" Value="0"></asp:ListItem>
</asp:RadioButtonList>
</div>
</div>
<div id="secondCategory">
<div style="float: left; width: 250px;">
Is a fixed-term employee</div>
<div>
<asp:RadioButtonList ID="YesNoIsFixedTermEmployee" runat="server" RepeatDirection="Horizontal">
<asp:ListItem Text="Yes" Value="1"></asp:ListItem>
<asp:ListItem Text="No" Value="0"></asp:ListItem>
</asp:RadioButtonList>
</div>
</div>
<div id="thirdCategory">
<div style="float: left; width: 250px;">
No external recruit</div>
<div>
<asp:RadioButtonList ID="YesNoExternalRecruit" runat="server" RepeatDirection="Horizontal">
<asp:ListItem Text="Yes" Value="1"></asp:ListItem>
<asp:ListItem Text="No" Value="0"></asp:ListItem>
</asp:RadioButtonList>
</div>
</div>
<div id="btCreate" style="margin-left: 200px; margin-top: 10px;">
<asp:Button runat="server" Text="Create Checklist" ID="btCreateChecklist" />
</div>
</div>
usercontrol.ascx.cs:
protected void Page_Load(object sender, EventArgs e)
{
btCreateChecklist.Click += new EventHandler(btCreateChecklist_Click);
}
void btCreateChecklist_Click(object sender, EventArgs e)
{
ValueOfIsNotPermanentEmployee = YesNoIsNotPermanentEmployee.Text;
ValueOfIsFixedTermEmployee = YesNoIsFixedTermEmployee.Text;
ValueOfNoExternalRecruit = YesNoExternalRecruit.Text;
UserCategoryID = ValueOfIsNotPermanentEmployee + ValueOfIsFixedTermEmployee + ValueOfNoExternalRecruit;
}
default.aspx:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="EmployeeCategorizationControl._Default" %>
<%# Register TagPrefix="UserControl" TagName="EmployeeCategorizationControl" Src="~/EmployeeCategorizationControl.ascx" %>
<!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>
</head>
<body>
<form id="form1" runat="server">
<div>
<UserControl:EmployeeCategorizationControl runat="server" />
</div>
</form>
</body>
</html>
This code appears to work perfectly as I see it. I've transplanted your code into a local application as is (changing namespaces to eliminate compile errors) and it posts back just fine. However, your event doesn't do anything except set a couple of variables (which you don't explain what they do or relate to). Are you sure it's not performing the post back? This page is small enough that a postback may not even cause the screen to flash (since there is no actual action going on). You should put some visible action into the event method such as changing the text of a label or the BackColor of the button.
If you have AutoEventWireup="true" there is no need for:
btCreateChecklist.Click += new EventHandler(btCreateChecklist_Click);
Either set it to false or remove the above statement.