I have a request that I’m having difficulty working out…
Once the 'Name' field is completed, the 5 labels below it should show a red asterisk
Form
I’ve added a RegularExpressionValidator which dynamically displays a red asterisk next the name label once the textbox is populated and tabbed, however this isn’t what’s required.
RegularExpressionValidator
<asp:RegularExpressionValidator runat="server" ControlToValidate="txtNewDos" Display="Dynamic" CssClass=" mandatory" ValidationExpression="^([\S\s]{0,1})$"></asp:RegularExpressionValidator>
ASP
<asp:Label runat="server" ID="lblNumCurStudentsDos" Text="Number of Current PGR students supervised"></asp:Label>
CSS
.mandatory:after
{
content:' *';
color:red
}
Can anybody point me in the right direction as to how I can populate my CSS class next the 5 labels once the Name text box has been populated?
Placing the RegularExpressionValidator within each label <td> </td> works
<asp:RegularExpressionValidator runat="server" ControlToValidate="txtNewDos"
Display="Dynamic" CssClass=" mandatory" ValidationExpression="^([\S\s]{0,1})$">
</asp:RegularExpressionValidator>
Related
I'm working on a web application that has been written in VB.net. On the login page for the app, there is an error message that's displayed conditionally, if the user clicks the Log In button having not entered anything into the password box:
The functionality of this all currently works correctly, and the message is only displayed when nothing has been entered into the password field, and there is a click off the form, or on the 'Proceed' button.
However, there is space left where the message would be displayed, even when it isn't:
I have been asked to remove this space, so that the 'Forgotten Password' link is displayed directly below the Password text box when the error message is not displayed.
However, despite setting the visibility attribute of the error message element in the CSS, I can't actually seem to remove the space when the message is not shown.
The only way I have found of doing this is to set the element's display attribute to none in the CSS- but this obviously then means that the message is not displayed when the password field is left blank.
The CSS set on the field is:
.loginarea .loginerror {
color: Red;
font-size: 1.8em;
}
and the form field is displayed with:
<body class="login">
<form id="form1" runat="server">
...
<div id="divLoginBg" runat="server" class="loginbg">
<div class="loginarea">
<asp:Panel ID="Step1" CssClass="greyblock" runat="server">
<asp:TextBox ID="Password" ValidationGroup="loginpage" autocomplete="off" TextMode="Password" runat="server" /><br />
<asp:RequiredFieldValidator ID="Req2" ValidationGroup="loginpage" ControlToValidate="Password" runat="server" CssClass="loginerror" ErrorMessage="Please enter your password" /><br />
...
</asp:Panel>
...
</div>
</div>
</form>
</body>
How can I set the element's display attribute to none conditionally? i.e. its display should only be none when there is no password entered in the text box?
use display:none instead of visibility:hidden as using the first make the tag in question not to appear on the page at all and there will be no space allocated for it.
Using the second makes the tag not visible, but space is allocated for it on the page
Here is a working Fiddle
use this css
.loginarea .loginerror {
display:none;
color: Red;
font-size: 1.8em;
}
and if you are using any jquery for filed validation which check for empty username or password. just write this to show this message
$('.loginerror').show();
This is not a pretty application by any stretch. It's only meant for a select few to use in the office and does not require street appeal. With that said...
I have a gridview with the following template column:
<asp:TemplateField HeaderStyle-HorizontalAlign="Left">
<ItemTemplate>
<asp:Label ID="lblAction" runat="server" Text='<%#(Eval("Action"))%>'
ToolTip="Action to be Taken"></asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:TextBox ID="txtAction" runat="server"
TextMode="MultiLine" Width="450px" Height="100px" ValidationGroup="UpdateFU"
Text='<%#Eval("Action")%>'
CssClass="RequiredText" ToolTip="Follow-Up Action">
</asp:TextBox>
<asp:RequiredFieldValidator ID="rfv_txtAction" runat="server"
ControlToValidate="txtAction" ErrorMessage="FollowUp Action is Required"
Text="*" ValidationGroup="UpdateFU">
</asp:RequiredFieldValidator>
</EditItemTemplate>
<FooterTemplate>
<asp:TextBox ID="txtAction" runat="server"
TextMode="MultiLine" Width="250px"
ValidationGroup="UpdateFU"
CssClass="RequiredText"
ToolTip="Follow-Up Action">
</asp:TextBox>
<asp:RequiredFieldValidator ID="rfv_txtAction" runat="server"
ControlToValidate="txtAction" ErrorMessage="FollowUp Action is Required"
Text="*" ValidationGroup="AddFU">
</asp:RequiredFieldValidator>
</FooterTemplate>
</asp:TemplateField>
For the example that is causing me trouble, the data in the field that is bound to this column is: **Testing with a link. Google**
The label in the ItemTemplate displays as I expect it to. The regular text is not hyperlinked and the hyperlink text is. Please see the included image:
ItemTemplate
When my row is in Edit mode, it also displays in the TextBox as I would suspect. Please see the included image: EditItemTemplate
When I attempt to Save or Cancel the record, the gridview does not recognize that the command button was clicked. It just sits there. If I remove the text that references the tag (leaving from my example, **Testing with a link.**), it works beautifully. The only problem being that I can't save any text in the textbox with my link.
Any help is greatly appreciated.
I think you are using UpdatePanel around your GridView. That is why you are missing exceptions if you are not checking the browser console. And that exception could very well be A potentially dangerous Request.Form value was detected from the client
Fixes for that here
A potentially dangerous Request.Form value was detected from the client
A potentially dangerous Request.Form value was detected from the client
https://www.codeproject.com/Tips/297679/A-potentially-dangerous-Request-Form-value-was-det
https://www.aspsnippets.com/Articles/ASPNet-Error-A-potentially-dangerous-RequestForm-value-was-detected-from-the-client.aspx
First, take a look at the thing we can see
As you can see, at the From we have an invalid email address, while at the To we have no email address. Both fields have a RequiredFieldValidator and another validator. In the case of the From, the other validator is a RegularExpressionValidator. Since the To has an email address, its correct email address of Invalid is displayed and since it is not empty, Required is not displayed. My aim is to display the error at the rightmost corner, regardless of whether it is a RequiredFieldValidator or a RegularExpressionValidator and regardless of the relative structural position of the tag among its siblings. To keep things simple, I paste the structure I have for the From:
<div class="ui-field">
<label class="ui-label" for="<%= From.ClientID %>">From</label>
<span class="ui-field-req"> *</span>
<asp:RequiredFieldValidator ID="FromValidator" runat="server" ControlToValidate="From" CssClass="ui-field-error" ErrorMessage="Required" ForeColor="Red"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="FromEmailValidator" runat="server" CssClass="ui-field-error" ValidationExpression="\w+([-+.]\w+)*#\w+([-.]\w+)*\.\w+([-.]\w+)*" ControlToValidate="From" ErrorMessage="Invalid" ForeColor="Red"></asp:RegularExpressionValidator>
<asp:TextBox ID="From" runat="server" CssClass="ui-input"></asp:TextBox>
</div>
This is the relevant part of CSS I have written for the page:
.ui-form .ui-field-error {
float: right;
}
And this is what we have generated for the From as HTML:
<div class="ui-field">
<label class="ui-label" for="ctl00_PageBody_From">From</label>
<span class="ui-field-req"> *</span>
<span id="ctl00_PageBody_FromValidator" class="ui-field-error" style="color:Red;visibility:hidden;">Required</span>
<span id="ctl00_PageBody_FromEmailValidator" class="ui-field-error" style="color: red; visibility: visible;">Invalid</span>
<input name="ctl00$PageBody$From" type="text" value="rocli#cablevision.com" id="ctl00_PageBody_From" class="ui-input">
</div>
Final detail: If I remove the inner text of Required of the RequiredFieldValidator, then Invalid will jump to the right place. Is there a way either in plain CSS or some properties/attributes in ASP.NET to resolve this? If not, then the solution will involve Javascript DOM watchers which I would like to avoid.
This can be controlled by specifying Display property of your validator. Since you do not want white space to occupy when there is no corresponding error message, you need to set your Display property to Dynamic.
<asp:RequiredFieldValidator ID="FromValidator" runat="server" ControlToValidate="From"
CssClass="ui-field-error" ErrorMessage="Required" ForeColor="Red" Display="Dynamic"/>
When you do not set this property, the default value of Static is considered and space is occupied by the control equivalent to the length of the message you have on ErrorMessage property of that control.
Dynamic ensures that space for error message on the page is utilized only when validation fails for that control.
This MSDN article describes more about this property.
I am trying to simply bind a HTML Input radio button inside a repeater :
<asp:Repeater ID="Outlets" runat="server" >
<ItemTemplate>
<input type="radio" name="Proposal" value="Test1" id="Radio1" checked="
<%#`GetSelectedValue(DataBinder.Eval(Container.DataItem,"IsDefaultSelection"))%>" />`
<label for="Test1">
<%#DataBinder.Eval(Container.DataItem, "Label")%>
</label>
</ItemTemplate>
</asp:Repeater>
The GetSelectedValue method simply returns a string "checked" for the radio button to be selected, lets say the repeater had 3 items to loop and when the markup renders and If I inspect the element I see the correct value for the first radio button i.e. checked="checked" but on the UI the 3rd radio button gets selected even though its checked value="false", can someone guide me as to what i am doing wrong?
Give this a try
<%# (bool)Eval("IsDefaultSelection") ? " checked=\"checked\" " : string.Empty %>
Basically the inclusion on the checked attribute is causing the RadioButton to be checked. You want to pull it out so the entire thing is rendered or the entire thing is absent.
Also keep in mind all your RadioButtons are going to be named Test1 It might be a good idea to use a server side RadioButton.
The CHECKED attribute in HTML has no value associated with it. You should only use this attribute if you want to select it.
You want something like:
<asp:Repeater ID="Outlets" runat="server" >
<ItemTemplate>
<input type="radio" name="Proposal" value="Test1" id="Radio1" <%
if (GetSelectedValue(DataBinder.Eval(Container.DataItem,"IsDefaultSelection"))
response.write("CHECKED");
%> />
<label for="Test1">
<%#DataBinder.Eval(Container.DataItem, "Label")%>
</label>
</ItemTemplate>
</asp:Repeater>
Otherwise you could simply use the ASP.NET INPUT controls.
I want to render a <label> tag. But want to set some of it's properties while it's rendering like for and text value.
Actually my real problem is I want to associate a label with a radio button and this is the code so far I have:
<asp:RadioButton ID="Option4" GroupName="A" runat="server" />
<label for='<%=Option4.ClientID %>' id="lblOption4" runat="server">4</label>
But the problem with this code is that it is not working and rendering the for attibute's value as it is i.e. <%=Option4.ClientID %>. :-(
Is their any asp net server control which would render tag?
I don't want to set the Text property of the radio button due to some CSS limitations so plz do not give answers like why don't you set the Text property of the radio button.
if this is .NET 2.0 or later, then use the ASP.NET LABEL control.
<asp:RadioButton ID="Option4" GroupName="A" runat="server" />
<asp:Label AssociatedControlId="Option4" Text="4" runat="server" />
If this is to ultimately handle accessiblity issues you could try the following tutorial: Creating an Accessible LABEL control in ASP.NET