How To Add HTML Code To Asp Button's Text Attribute - html

I'm trying to add a symbol for a button's text but this shows no text. What's the correct way?
The symbol is an arrow - here.
<asp:button id="btnAdd" runat="server" class="next"/>
CSS:
.next
{
content = ❯
width:50px;
}
When I say Text='❯', it shows a '?' symbol

Try this one:
<asp:button id="btnAdd" runat="server" class="next" Text="❯"/>

It is easiest to set the Text attribute of the asp:button
<asp:button Text="→" .../>
EDIT:
the entity you are using doesn't render, try this one: → →
If you really need a css solution:
content is only a valid rule when using the :before or :after pseudo-selectors, note: you're not really setting the content of the button, you're adding a text element after the button! Also, if using content, you need to use unicode
.next:after{
content: "\25BA";
}
http://css-tricks.com/css-content/

<input type="submit" value="➙">
In ASP.NET
<asp:Button ID="btnLogin" Text="Login ➙" runat="server" />

Related

Element hidden by CSS still takes up space on page- how do I set display: none conditionally?

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();

how to bypass required field validation when clicking the cancel button?

I've used HTML input type for my textboxes to utilize the required attribute. now my dilemma is i cannot go out of the page without filling-up the fields with required attributes. Ive tried using causeValidation set to false but its not working. i can not change my textboxes to asp textboxes because it's going to be a large changes in the page. is there any other way to this?
<asp:Button runat="server" ID="buttonCancel" CssClass="cu-btn-direction" style="float:right; margin-right: 15px; margin-bottom: 60px;" Text="Cancel" CausesValidation="false" />
EDIT:
I tried adding validation group but didn't work... what works is setting the UseSubmitBehavior to false http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.button.usesubmitbehavior%28v=vs.110%29.aspx but as explained in the link it will not work without js enabled. any other way?
use formnovalidate
<input type="submit" value="Cancel" formnovalidate>
this bypass all form validation like required

Unable to call server side method in asp.net

I am working in asp.net. I have this HTML tag
HTML tag:
<button id="submit" class="button" onserverclick="delete_Click">Login</button>
Serverside Function:
Response.Redirect("Login.aspx");
When I click the button it should go to Login.aspx page. But button is not working. Where am I mistaking?
Use OnClick instead of onserverclick and better to use ASP.NET control if you are achieving this
<asp:Button ID="submit" runat="server" CssClass="button" OnClick="delete_Click">Login</asp:Button>
You need to add:
runat="server"
to the html tag.
Also, you need to make use of the OnClick event handler.
In essence, you tag should look like this:
<asp:Button ID="submit" runat="server" class="button" OnClick="delete_Click">Delete</asp:Button>
Hope this helps!!!

Using Special HTML symbols inside ASP Button Controller

I would like to display an arrow inside an ASP Button Controller.
The arrow will display perfectly if I used an HTML button.
<button>&#x25B2</button>
I know it works because I can insert HTML tags inside <button>. But the same will not work with an ASP Button.
<asp:Button ID="Button1" runat="server" Text="&#x25B2" />
Is there any way to display an arrow inside the ASP button?
I'm pretty sure you just need a delimiter (;) at the end of the special character:
<asp:Button ID="Button1" runat="server" Text="▲" />
or try
<asp:Button ID="Button1" runat="server">▲</asp:Button>

Is their any asp net server control which could render <label> tag?

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