无法从代码后面更改CssClass [英] Can't Change CssClass From Code Behind
问题描述
这是世界上最简单的事情，但它只是不工作。
我有一个外部div，我想应用一个类使其显示style = none，以便隐藏其中的所有内容。它实际上是一个asp：panel元素，所以我假设我可以在代码中设置control.CssClass =my-hidden-class。
我实际上是在一个按钮点击处理程序（取决于某些条件）上设置此类，但类从不应用。当我检查Firebug中的div元素时，它甚至没有类属性。它看起来完全一样，它在.aspx标记（实际的css类是好的，当我声明性地添加它应用）。
此外，我可以看到类应用如果我在初始get请求的预渲染方法中设置CssClass。所以我想也许我会把所有的逻辑prerender和更新的Css类相应。这也不工作 - 类获得应用在初始的确定，但我不能改变它随后。
所以，总结，似乎我可以' t在事件处理程序中根据后面的代码应用类，我只能将其应用于prerender以获得初始get请求&
编辑：这里是代码 - >
aspx：
< asp：panel runat = ID =TariffContainer><！ - 这是我要切换的div - >
< cms：ContentBlock ID =currentTariffsInfoSkinID =Public / OurPrices / CurrentTariffsInforunat =server/>
< ucTcrPanel：tcrpanel ID =tcrpanelPagingEnabled =truerunat =server/>
< div class =quick-price>
< asp：LinkButton runat =serverCausesValidation =falseID =QuickEnergyPriceOnClientClick =Javascript：return false; CssClass =button subcontent>< span>获得快速能源价格< / span>< / asp：LinkButton>
< / div>
< div class =not-for-sale>
< cms：ContentBlock ID =preservedTariffsLinkInfoSkinID =Public / OurPrices / PreservedTariffsLinkInforunat =server/>
< p>
< asp：LinkButton runat =serverCausesValidation =falseID =ViewNotAvailableTariffsOnClick =RedirectToUnavailableTariffscssclass =arrow>查看关税不可销售< / asp：LinkButton>
< / p>
< / div>
< / asp：panel>
代码背后：
protected void PostCodeChange_BtnClick（object sender，EventArgs e）
{
if（IsValid）
{
tcrpanel.ApplyPostcodeUpdate（postcode.EnteredPostCode）;
tcrpanel.TcrUpdatePanel.Update（）;
}
else
{
TariffContainer.CssClass =formContentHidden;
}
}
更新 - 按钮点击事件来自用户控制&这被连接到触发更新面板上的更新 - 即部分回发正在发生。我在做这个隐藏&显示的div在包含aspx页面&即使所有的服务器端页面事件正在执行我猜猜页面的内容没有被重新呈现，所以我没有看到我的更改。
解决方案 - 我结束了从服务器喷出一些javascript：
code> protected void PostCodeChange_BtnClick（object sender，EventArgs e）
{
tcrpanel.ApplyPostcodeUpdate（postcode.EnteredPostCode）;
tcrpanel.TcrUpdatePanel.Update（）;
}
然后在tcrpanel用户控制代码后面：
public void ApplyPostcodeUpdate（string postcode）
{
if（IsValid）
{
BuildStartUpScript（showTariffContainer （）;）;
}
else
{
BuildStartUpScript（hideTariffContainer（）;）;
}
}
private void BuildStartUpScript（string functionCall）
{
StringBuilder script = new StringBuilder（）;
script.AppendLine（< script type = \text / javascript \>）;
script.AppendLine（functionCall）;
script.AppendLine（< / script>）;
ScriptManager.RegisterStartupScript（pnlUpdateTcr，pnlUpdateTcr.GetType（），HideTariffContainerScript，script.ToString（），false）;
}
然后在包含的JS文件中：
function hideTariffContainer（）{
$（div.formContentVisible）。toggleClass（）。toggleClass（formContentHidden）;
}
function showTariffContainer（）{
$（div.formContentHidden）。toggleClass（）。toggleClass（formContentVisible）;
}
可以这样说，问题是，发生了部分回发，其中只有更新面板的内容被重新呈现。所有服务器端页面生命周期事件仍在调用。这是什么困惑我，因为我可以调试，看到CssClass正在应用，但不是在html中呈现。只是Asp.Net更新面板工作的方式我猜。
This has to be the simplest thing in the world but it just isn't working.
I have an outer div to which I want to apply a class to make its display style = none so that it hides all the content within it. It's actually an asp:panel element so I'm assuming I can just set control.CssClass = "my-hidden-class" in the code behind.
I'm actually setting this on a button click handler(depending on certain conditions) But the class is never applied. When I inspect the div element in Firebug it doesn't even have a class attribute. It appears exactly as it is in the .aspx markup (the actual css class is fine & gets applied when I add it declaratively).
Also, I can see the class applied if I set CssClass in the prerender method on the initial get request. So I thought maybe I'll put all the logic in prerender and update the Css Class accordingly. This also doesn't work - the class gets applied on the initial get ok but I can't change it subsequently.
So, to sum up it seems I can't apply class from code behind at all in the event handler and I can only apply it in prerender for the intial get request & this value is persisted on all postbacks.
What am I doing wrong?
Edit: Here's the code -
aspx:
<asp:panel runat="server" ID="TariffContainer"><!--this is the div I want to toggle-->
<cms:ContentBlock ID="currentTariffsInfo" SkinID="Public/OurPrices/CurrentTariffsInfo" runat="server" />
<ucTcrPanel:tcrpanel ID="tcrpanel" PagingEnabled="true" runat="server" />
<div class="quick-price">
<asp:LinkButton runat="server" CausesValidation="false" ID="QuickEnergyPrice" OnClientClick="Javascript:return false;" CssClass="button subcontent"><span>Get a quick energy price</span></asp:LinkButton>
</div>
<div class="not-for-sale">
<cms:ContentBlock ID="preservedTariffsLinkInfo" SkinID="Public/OurPrices/PreservedTariffsLinkInfo" runat="server" />
<p>
<asp:LinkButton runat="server" CausesValidation="false" ID="ViewNotAvailableTariffs" OnClick="RedirectToUnavailableTariffs" cssclass="arrow">View tariffs not available for sale</asp:LinkButton>
</p>
</div>
</asp:panel>
Code Behind:
protected void PostCodeChange_BtnClick(object sender, EventArgs e)
{
if (IsValid)
{
tcrpanel.ApplyPostcodeUpdate(postcode.EnteredPostCode);
tcrpanel.TcrUpdatePanel.Update();
}
else
{
TariffContainer.CssClass = "formContentHidden";
}
}
Update - The button click event is coming from a user control & this is wired up to trigger an update on an update panel - i.e. a partial postback is happening. I'm doing this hiding & showing of the div in the containing aspx page & even though all the server side page events are executing I'm guessing that the content of the page isn't getting re-rendered so I'm not seeing my changes.
The Solution - I ended up squirting a bit of javascript down from the server:
protected void PostCodeChange_BtnClick(object sender, EventArgs e)
{
tcrpanel.ApplyPostcodeUpdate(postcode.EnteredPostCode);
tcrpanel.TcrUpdatePanel.Update();
}
Then in the tcrpanel user control code behind:
public void ApplyPostcodeUpdate(string postcode)
{
if (IsValid)
{
BuildStartUpScript("showTariffContainer();");
}
else
{
BuildStartUpScript("hideTariffContainer();");
}
}
private void BuildStartUpScript(string functionCall)
{
StringBuilder script = new StringBuilder();
script.AppendLine("<script type=\"text/javascript\">");
script.AppendLine(functionCall);
script.AppendLine("</script>");
ScriptManager.RegisterStartupScript(pnlUpdateTcr, pnlUpdateTcr.GetType(), "HideTariffContainerScript", script.ToString(), false);
}
Then in the included JS file:
function hideTariffContainer() {
$("div.formContentVisible").toggleClass().toggleClass("formContentHidden");
}
function showTariffContainer() {
$("div.formContentHidden").toggleClass().toggleClass("formContentVisible");
}
As suspected, the problem was that a partial postback was occurring in which only the contents of the update panel were being re-rendered.
That said, all the server side page lifecycle events were still being invoked. This is what confused me as I could debug and see the CssClass being applied but not being rendered in the html. Just the way Asp.Net update panels work I guess.
这篇关于无法从代码后面更改CssClass的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
