I have 2 asp:RadioButton that are unchecked when the page is loaded. When one is checked, I want to change the font-weight to bold in client script. I tried:
radio1.style.fontWeight = 'bold';
but it didn't work.
You can access the the css class using the attributes property. I am assuming radio1 is the id if so you could modify your c# code to
radio1.Attributes["class"] = "newCssClassName";
I personally have never modified a single property of css using c#. To do that I have always used something like jQuery.
Try to create a new css class such as
.rbSelected
{
font-weight:bold;
{
And then toggle them accordingly ( your css property should be font-weight not fontWeight)
Also a word of warning with controls such as radio buttons and checkboxes the browser will override your styling in most cases. Each browser will render the control differently regardless of what style(s) you apply. If you are looking for something custom you may need to create your own control/element (Such as an image/element that looks like a checkbox but has manages states handled in code)
For bold
$("#YourElementID").css("font-weight","bolder");
For regular
$("#YourElementID").css("font-weight","normal");
You can create a function with this lines to toggle the font-weight. To call the javascript function from the server side controls use:
radio.Attributes.Add("onclick","functionname()");
This will add the functionname to the onclick event when the radio button is rendered to the browser.
Related
I use ajaxToolkit:TabContainer to organize page contents. Some times, I need to hide some tabs based on conditions. The problem is, I would like to read the content of hidden tab using JavaScript. So I can not use C#'s Tab.Visible = false because it will not render the tab.
When I use CSS's display:none; or visibility:hidden;, the tab still there (without tab titles). I guess Ajax tab does not support the css properties. What are the alternatives should I use ?
You can use TabContainer1.Tabs[0].Enabled = false; to hide tab, it will still generate the DOM element for this tab and you can access it using javascript.
I'm developing a page in which I've given users an interactivity to change the background color of a page by clicking particular button. I am trying to find out through various sites but they are giving the information about how to change the background color of the text box or grid view. it is a bit like customization tool which you find in various sites like orkut and face book.
in the css/style
body
{
background-color:#000000;
}
But since it seems like you want to change the color on the fly then either in a javascript or code behind, change the class of the body to one that has background-color applied.
eg. for the code behind, make sure to set the with a runat="server" and id
and then in code behind:
bodyId.Attributes["class"] = "test";
in css:
.test
{
background-color: #000000 !important;
}
Note that this will happen after a postback, while in the sites you mentioned it probably uses javascript.
You can use jQuery to modify the DOM on the fly, which would be perfect for your situation. Here's a quick sample using the .css() method. Once you make that change, you can store the value in a cookie or some other mechanism and use it next time the page is loaded.
//assumes MyButtonId is the id of the button the user clicks
$('#MyButtonId').click(function () {
//set the background-color of the body element to green
$('body').css('background-color', '#00F')
});
I get this error when I try to have my C# class change the skin of an asp control:
The 'SkinId' property can only be set in or before the Page_PreInit
event for static controls. For dynamic controls, set the property before
adding it to the Controls collection.
My goal is to provide a panel, call it ID="response", on every page, and then dynamically change it's CSS class from Error to Success, or Success to Error (so it's red or green). And also I make it visible = true, when a response is created.
Apparently, I am forced to use CssClass attribute, which is the only way this will work.
As a side-off-topic note:
In PHP, you would not have a problem of using different "pre-init" "post-init" etc. A completely unnecessary process. You would simply change the html before you send it back to the user. I'm a bit confused why ASP.NET decides to overcomplicate everything. It's a bit silly for me to take time to learn all these different complicated processes to simply display a webpage. It takes time to learn all the quirks written in difficult-to-read ASP life-cycle documents on microsoft. Not to insult any microsoft people, but it's just not practical.
If it is a static control, that is you are defining the Panel in your .aspx page, then the only place to change the SkinId is in the PreInit method e.g.:
protected override void OnPreInit(EventArgs e)
{
base.OnPreInit(e);
String panelSkin = ViewState("panelSkin").toString();
panel1.SkinId = panelSkin;
}
Of Course, the PreInit method is only called when the Page is being first Initialized -- not on a PostBack.
You could save the skinId you wanted to use to the ViewState and then call a Response.Redirect("myPage.aspx")... and as seen above grab the skinId string from the ViewState and set the Panel skinId accordingly.
Alternatively, rather than using a Panel try using an UpdatePanel from the .Net Ajax library. Clicking a button in the UpdatePanel (provided it's setup to Trigger an ASyncPostBack) will run the OnPreInit method.
That said, provided you are changing the background, going with the CssClass property would be the most efficient way to do this.
ASP, and its child ASP.NET, is basically a huge hack of vanilla HTML and the IIS page renderer. It hooks into various stages of the lifecycle that already existed in IIS, rather than having its own lifecycle like PHP. As such, there are things you can do in certain areas because the things it depends on either aren't set in stone so you can change them, or are so you can work with them. The great power of ASP.NET, which is the interop with .NET classes and the .NET Framework, IMO makes up for some of its idiosyncracies.
Anyway, Skins are part of Themes, which are loaded early in the process so the controls can be initialized with their proper default Styles. That's the key; the Theme is locked after PreInit, but the Styles (and CssClasses) behind the Skins are editable right up to and including PreRender, which includes event handlers (which fire validation). So, set the Style or the CssClass dynamically.
To do it without a full postback, you can put the controls that should change color in an AJAX UpdatePanel, which can be re-rendered separately from the other elements of the page and will keep its current contents until the DOM is modified via the JavaScript client-side.
Setting the CssClass attribute is much closer to what you'd do with PHP, so why not just do that?
The two real benefits of Skin files are setting defaults for all controls (no skinId at all) or setting properties that can't be controlled with css.
How do I setup a default setting so that if I do not set an OnClick (i.e the asp.net OnClick attribute) explicitly for an asp:LinkButton tag, it will not render an onclick(html attribute for javascript) attribute client side? By default, asp.net adds an onclick='doPostBack....' for the LinkButton.
Case for use:
There is a LinkButton tag on the page. For this page, if the user has one friend, I only want to run client side code if the button is clicked and would not for any reason want to make a post back. If the user has more than one friend I would want a click to trigger a postback.
Solutions that include the following are not helpful:
Using any asp.net Ajaxtoolkit
Dynamically switching the control type (i.e. if friends == 1 use a asp:Hyperlink)
-I want to avoid this because it is not scalable. There might be many cases where I want an asp:Link tag to do a postback or to not do a postback depending on the user context or user attributes
Using OnClientClick (I am using jQuery would like to avoid this)
Solution that would be helpful if possible:
If I could see server side at runtime whether an OnClick event was explicitly set on an asp:LinkButton tag, this would solve my problem, too. any ideas?
How about rather than dynamically switching the controls (as you mentioned is a solution you don't want), you could always use an asp:HyperLink and set the NavigateUrl property to redirect your page back to itself with a query string of some sort indicating what was clicked.
If you don't want the post to happen at all, simply leave the NavigateUrl property blank.
Of course, this will be pretty worthless if the rest of the page is dependent on ViewState and such.
http://forums.asp.net/t/1129106.aspx
This link explains how to see server side at runtime whether an OnClick event was explicitly set using reflection
I am trying to change a label's text by using server-side JavaScript (onclick) and C# within the page_load event. For example, I would like to write something like the following:
Label1.Attributes.Add("onclick", "Label2.text='new caption'")
Does anyone know the correct code for this? Also, what is this type of code referred to; is it just JavaScript or JavaScript in C# or is there a specific name? Lastly, does a book or online resource exist that lists the choices of control.attributes.add("event", "syntax") code to use with C#?
There is no server-side Javascript (unless you change to a platform other than ASP.NET where you actually use Javascript as server language). What you are doing is adding an attribute to the html tag, and the code will be executed entirely on the client side.
First, let's look at how it's done in HTML without the server side code and server side controls:
<span onclick="document.getElementById('Label2').innerHTML='Thank you';">Click me</span>
<span id="Label2"></span>
To use Label controls instead, setting the onclick attribute from server side code, you would do like this:
Label1.Attributes.Add("onclick", "document.getElementById('Label2').innerHTML='Thank you';");
This will work as long as the controls are not inside a naming container. If they are, the id of the controls are prepended with the name of the container to keep them unique, so you need to use the ClientID property to find out what their final id is:
Label1.Attributes.Add("onclick", "document.getElementById('" + Label2.ClientID + "').innerHTML='Thank you';");
The ClientID always contains the id that you can use to access the element from Javascript, so the last code always works regardless if the control is in a naming container or not.
To find out what attributes you can use, you should look at the HTML documentation, for example the Internet Explorer documentation for the span element. When looking at the documetation for a specific feature, notice the Standards Information, as that will tell you if it works in any browser or just in Internet Explorer.
The code above adds JavaScript to a server control rendered on the client. Take a look at this MSDN article - Using JavaScript Along with ASP.NET for more information.
IIRC, you will need to reference Label2 by its ClientID and will need to write some JavaScript to change the label's text value (I think ASP.NET labels get rendered as <span> tags).