We Keep Coding

How to set anchor for label in web form application in code? c#

I wanted to set anchor for label but in properties of label i could not find anchor field and how can set it by code maybe in style?
I tried to write in page_load label.Anchor but it cant find this class.
.labelName{float: left; text-align: center; margin-left: 810px ; margin-top: 20px;width: 150px; }
</style>
<div class="labelName">
<asp:Label ID="lblGameName" runat="server" Text="Huina Game"> </asp:Label>
</div>

You should use asp:HyperLink that render as anchor or asp:LinkButton if you need to do a postback with server side handler
<asp:HyperLink ID="labelWithLink" runat="server" NavigateUrl="https://stackoverflow.com" Target="_blank"></asp:HyperLink>
<asp:LinkButton ID="labelWithLinkAndPostback" runat="server" OnClick="ServerSideHandler_click" ></asp:LinkButton>

Trouble with CSS in ASP.NET 4.6

I have a project I've been working on for the past couple of months. Everything has been working fine up till today. When I came I noticed that all my button sizes were the same. I like to use the developer tools in Chrome to help debug my websites, and when I looked to see why the buttons weren't displaying properly; nothing seemed amiss. So will you please help me identify what is going on and how I should fix it?
Here is the .aspx code:
<div class="row section text-center">
<h2><%: Page.Title %> Page</h2><br />
<asp:Button ID="stReturnButton" runat="server" CssClass="stButton-lg" Text="Back to Training Portal" PostBackUrl="~/SST/SafetyTrainingPortal.aspx" />
<hr />
</div>
<div class="row col-xs-12 text-center">
<div class="col-xs-6 text-center">
<asp:Button ID="btnEditUpdate" runat="server" Text="Update Employee Certificates" CssClass="stButton-lg" PostBackUrl="~/SST/SUPERVISOR/UpdateCertificates.aspx"/>
</div>
<div class="col-xs-6 text-center">
<asp:Button ID="btnAddCerts" runat="server" Text="Update Employee Profile" CssClass="stButton-lg" PostBackUrl="~/SST/SUPERVISOR/UpdateEmployeeProfile.aspx" />
</div>
Here is what the page looks like now:
This is the CSS for the buttons:
.stButton {
width: 190px;
opacity: 1.0;
color: #0e4676;
background-color: #9FCF6E;
border-color: #357ebd;
padding: 5px;
margin-bottom: 5px;
border-radius: 10px;
box-shadow: #063156 3px 3px;
cursor: pointer;
user-select: none;
text-align:center;
}
.stButton-lg {
width: 325px !important;
opacity: 1.0;
color: #0e4676;
background-color: #9FCF6E;
border-color: #357ebd;
padding: 5px;
margin-bottom: 5px;
border-radius: 10px;
box-shadow: #063156 3px 3px;
cursor: pointer;
user-select: none;
text-align: center;
}
As you can see I have CSS for a normal button and CSS for a larger button. The larger button being what I'm targeting in my .aspx code. I include the "!important" at the end of the width because the buttons aren't displaying correctly; just to see if that would help... obviously it didn't. I've also tried inline styling and that doesn't work either. One important note, I've viewed the page in the following browsers: IE, Chrome, and Edge.
Anyway, here are the links in the Master Page with a view of the files in the folder structure of the project:
I commented out the placeholder for the Script.Render since I'm declaring the links directly above the placeholder. Also, having it uncommented did nothing for me as well.
I think I've covered it all, so if I've missed something please let me know and I'll include it. I appreciate all and any help that is given.

Thank you for your help. I found the answer however and hopefully this helps someone else. The problem was that another less experienced team member had changed the width for the input controls to Max-Width: 150px in the CSS (not shown in the pictures above). That tiny thing through me for almost an entire day, but at least it was found and corrected.
Thank you to those who helped or commented.

How to stop css class on textbox

I have a textbox with a spinner that allows the user to select numbers. But if a certain user is logged in then I want to disable the textbox and the spinner.
<asp:TextBox runat="server" ID="txtCreditDays" CssClass="integeronly spinner" Text="0" Width="20px"></asp:TextBox>
I used this to disable the textbox:
txtCreditDays.Enabled = false;
But the user can still click on the spinner and change the value. I need to disable the spinner to but since it is a CssClass I don't know how.
Here is the code for the spinner:
.spinner {
border: 0px solid #85B1DE !important;
font-weight:normal !important;
padding:0px !important;
background: none !important;
min-width: 60px !important;
}
I can't edit the CSS code because it is being used by other parts of the code.

You can use Replace method very simple.
txtCreditDays.CssClass= txtCreditDays.CssClass.Replace("spinner","");

I Don't know asp.net. But i can give you a logic through php.
In PHP, We do like this.
<input type="text" class="<?php if($user_loged_in){ echo "some_other_class"; } else { echo "spiner";} ?>">

Using an if statement could solve this in asp

AJAX Collapsible Panel Extender Code Behind

I am having some problem with AJAX Collapsible Panel Extender. Currently what I am trying to do is when certain panel is extended, then it will perform some sql statement. I have no idea on how to write the code other than just squeeze all of them in the Page Load method. Here is how I set up my collapsible panel extender:
<!-- FIRST COLLAPSIBLE PANEL EXTENDER -->
<asp:Panel ID="pHeader1" runat="server" CssClass="cpHeader">
<!-- First collapsible panel extender header -->
<div class="form-group" style="background-color:#ffb848; height: 30px; vertical-align: middle">
<div class="col-md-3">
<div style="float: left; color: White; padding: 5px 5px 0 0">
Collapsible Panel
</div>
</div>
<div class="col-md-9">
<div style="float: right; color: White; padding: 5px 5px 0 0">
<asp:Label ID="lblHeaderText1" runat="server" />
<asp:Image ID="imgArrows1" Text = "IMAGE" runat="server" />
</div>
</div>
<div style="clear: both"></div>
</div>
</asp:Panel>
<!-- First collapsible panel extender body -->
<asp:Panel ID="pBody1" runat="server" CssClass="cpBody">
<asp:Label ID="lblBodyText1" runat="server" />
Hey there
</asp:Panel>
<asp:CollapsiblePanelExtender ID="cpe1" runat="server" TargetControlID="pBody1" CollapseControlID="pHeader1"
ExpandControlID="pHeader1" Collapsed="true" ImageControlID="imgArrows1"
CollapsedImage="~/Images/downarrow.jpg"
ExpandedImage="~/Images/uparrow.jpg" TextLabelID="lblHeaderText1" CollapsedText="Show"
ExpandedText="Hide" CollapsedSize="0" ExpandedSize="200"
ScrollContents="true">
</asp:CollapsiblePanelExtender>
Any related research link would be appreciated. Thanks in advance.

This is possible.
In gist you are supposed to work with the ajax client-side page life-cycle. Like there is a page load in your server-side aspx page; there is a page load in the client (i.e. the web page rendered in the browser) which happens after all the asp.net client ajax js libraries are all loaded.
In that you are supposed to do something like:
//this would be <%=myExtender.ClientID%> when using a master page
var extender = $find('myExtender_ClientId');
extender.add_collapsed( function() { alert('collapsed'); });
extender.add_expanded( function() { alert('expanded'); });
More details here: http://forums.asp.net/p/1112899/1717195.aspx
You'd want to execute some server side logic to populate stuff in the container that becomes visible. For this you need some AJAJ. This is nothing but some aspx pages written in such a way to render JSON responses back to your browser. But they will be invoked via an XMLHttpRequest object.
Alternatively you can rely on asmx web services, or even page methods to do the work for you. They've to run as script services to do the work for you.
Have a look at this thread for that: http://forums.asp.net/t/1729092.aspx?loading+data+in+the+target+control+panel+of+collapsible+extender+when+Collapse+Expand+control+panel+is+clicked+

Asp.net Ajax Control Toolkit - toggle button on same line

I'm using the toggle button from the Ajax Control Toolkit.
On my page I want the following layout (all on the one line):
Toggle Button | Text Box | Button | Button | Toggle Button
Problem
At the moment I have this layout:
Toggle Button | Text Box | Button | Button |
ToggleButton
Code for toggle button
<asp:CheckBox ID="CheckBoxToggleTips" runat="server" AutoPostBack="true"
OnCheckedChanged="CheckBoxToggleTips_CheckedChanged" />
<ajaxToolkit:ToggleButtonExtender ID="ToggleTips" runat="server"
TargetControlID="CheckBoxToggleTips"
ImageWidth="32"
ImageHeight="32"
CheckedImageAlternateText="Hide Tips"
UncheckedImageAlternateText="Show Tips"
UncheckedImageUrl="~/Images/lightbulboff.png"
CheckedImageUrl="~/Images/lightbulbon.png" />
HTML Expection
<div class="title">
<span id="mainContentPlaceHolder_LabelDepartment">A&H</span> Risks<br>
<div style="position: relative;">
<a id="mainContentPlaceHolder_CheckBoxToggleTips_ToggleButton" href="" style="position: absolute;
left: 0px; top: 0px; width: 32px; height: 32px; font-size: 32px;
background-image:url(http://localhost:10833/Images/lightbulboff.png);
background-repeat: no-repeat no-repeat;" title="Show Tips">
</a>
</div>
</div>
The style attribute above is auto generated. So my question is how can I use my own styling instead of this? Or how can I edit the left and top values?
Thanks

There is no reason why the second ToggleButton should be in the second line if it has the same css as the first one. I would recommend using CssClass attribute and make sure it uses the same class as the first ToggleButton. You are most likely running out of width, so contain the whole thing in an outer DIV and set the width appropriately. Hope this helps.

It looks like a page layout problem: check for the missing closing tag </div>
Hope this will help.
Regards, Alex

Hey You can Resolve by CSS like that.
#mainContentPlaceHolder_LabelDepartment{
margin:0;
padding: 2px;
width: 223px;
float:left;
height:450px;
position: relative;
}
This Sample code you can made your own code to styling the toggle button
Hope It helps you.