Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

How to change style from code behind?

Posted on 2008-10-13
19
Medium Priority
?
4,208 Views
Last Modified: 2013-11-08
I'm including an asp.net 3.5 project that I'd like to change the style attribute of a DIV tag.   The attribute remains set to what ever I've coded it in the aspx.  How do I overwrite the aspx value from code behind?
0
Comment
Question by:brettr
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 9
  • 5
  • 2
  • +2
19 Comments
 
LVL 7

Expert Comment

by:ajolly
ID: 22702495
yourDIV.Attributes.Add ("style","width :200px");
0
 
LVL 13

Expert Comment

by:SameerJagdale
ID: 22702563
in c#
myDiv.Attributes['your attribute name'] = 'new value';
0
 
LVL 8

Expert Comment

by:tiagosalgado
ID: 22702568
<div id="mydiv" runat="server" style="text-align: center">my div text</div>
And in code-behind you can mydiv.style.add("text-align","left")
0
Microsoft Certification Exam 74-409

Veeam® is happy to provide the Microsoft community with a study guide prepared by MVP and MCT, Orin Thomas. This guide will take you through each of the exam objectives, helping you to prepare for and pass the examination.

 

Author Comment

by:brettr
ID: 22702574
If you look at the project, I tried that and the values in the aspx aren't overwritten.  Project didn't come through b/c of the extensions.  Here's the code:

.CS
----
void btnShowPanel_Click(object sender, EventArgs e)
        {
            Panel2.Style.Clear();
            Panel2.Style.Add("display", "none");
}

ASPX
-----
<div id=Panel2 style="display:none" runat="server">
        <asp:UpdatePanel ID="UpdatePanel2" runat="server" Visible="true" UpdateMode="Always">
        <ContentTemplate>
        this panel is hidden<br />
            <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
        </ContentTemplate>
        </asp:UpdatePanel>
        </div>

btnShowPanel is in an UpdatePanel just above this one.
0
 
LVL 7

Accepted Solution

by:
ajolly earned 2000 total points
ID: 22702679
add the following javascript to your aspx page.

function hideBox(id){
document.getElementById(id).style.display = "none"
}

To show it:

function showBox(id){
document.getElementById(id).style.display = "block"
}


To hide, in code behind, write:

ScriptManager.RegisterStartupScript(Page, Page.GetType(), Guid.NewGuid().ToString(), "hideBox('"+Panel2.ClientID+");", true);


To show, in code behind, write:

ScriptManager.RegisterStartupScript(Page, Page.GetType(), Guid.NewGuid().ToString(), "showBox('"+Panel2.ClientID+");", true);
0
 

Author Comment

by:brettr
ID: 22702737
@SameerJagdale
That doesn't work either.

@ajolly
I'm trying to keep the code consolidated and don't want custom JS in the aspx.  

One solution is to create my own DIV with a visibility property and maintain its state via a private var.
0
 

Author Comment

by:brettr
ID: 22702847
@ajolly
I tried your code and that does work nicely.   How can I tell if the box is visible or not so I can toggle it?
0
 
LVL 8

Expert Comment

by:tiagosalgado
ID: 22702875
brettr, remove the style from aspx code and manage it only on code-behing.
0
 

Author Comment

by:brettr
ID: 22702901
@tiagosalgado
Actually, with ajolly's code is works fine.  I just want to know how to tell if it is visible or not.
0
 
LVL 8

Expert Comment

by:tiagosalgado
ID: 22702952
In that code you have 2 functions. One for hide and the other to show it. Just call the one you want!!
0
 

Author Comment

by:brettr
ID: 22702984
" Just call the one you want!!"
...based on the visibility.  I think you are missing the point.
0
 

Author Comment

by:brettr
ID: 22703100
Since visiblity is being changed by JS, I'll have to grab that state via JS as well.  If I do Panel2.Style and look at the visibility attribute, it will always show "hidden", even when it is actually "block", since that is how it's coded in the aspx.
0
 
LVL 8

Expert Comment

by:tiagosalgado
ID: 22703349
When you change the visibility attribute in JS function, you can set the value to an hidden field to that state, and access it on code-behind. Can be a possible solution for you?
0
 
LVL 22

Expert Comment

by:prairiedog
ID: 22703365
>>>
void btnShowPanel_Click(object sender, EventArgs e)
        {
            Panel2.Style.Clear();
            Panel2.Style.Add("display", "none");
}

So all you need is to hide/display the panel?  Can't you just use this?
void btnShowPanel_Click(object sender, EventArgs e)
{
       Panel2.Visible = true;
}

0
 

Author Comment

by:brettr
ID: 22703556
@prairiedog
No, that doesn't work.  The hard coded style="dispay:none" value overrides the code behind setting.
0
 
LVL 22

Expert Comment

by:prairiedog
ID: 22703580
You don't need style="display:none", just set Visible="false" (with runat="server"). Will that do?
0
 

Author Comment

by:brettr
ID: 22703720
I think the best way would be to change ajolly's code to be completed client side but also generic enough that I could pass a particular element id to it.

@prairiedog
You can't do that since the server div isn't there when you try to make it visible.  It needs to be inside another UpdatePanel for that to work, which I don't want.
0
 
LVL 8

Expert Comment

by:tiagosalgado
ID: 22703855
brettr, i think using a __doPostBack() and passing the visible state can solve your problem.
http://aspalliance.com/895_Understanding_the_JavaScript___doPostBack_Function.all
 
0
 

Author Comment

by:brettr
ID: 22703916
This works fine:

function showHideBox(id) {
            var el = document.getElementById(id);
            if (el.style.display == "none")
                el.style.display = "block";
            else
                el.style.display = "none";
        }

And in the control:
OnClientClick="showHideBox('Panel2')"

The DIV does need to be a regular DIV and not an UpdatePanel.
0

Featured Post

Tech or Treat!

Submit an article about your scariest tech experience—and the solution—and you’ll be automatically entered to win one of 4 fantastic tech gadgets.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

It was really hard time for me to get the understanding of Delegates in C#. I went through many websites and articles but I found them very clumsy. After going through those sites, I noted down the points in a easy way so here I am sharing that unde…
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
Are you ready to place your question in front of subject-matter experts for more timely responses? With the release of Priority Question, Premium Members, Team Accounts and Qualified Experts can now identify the emergent level of their issue, signal…
Please read the paragraph below before following the instructions in the video — there are important caveats in the paragraph that I did not mention in the video. If your PaperPort 12 or PaperPort 14 is failing to start, or crashing, or hanging, …

610 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question