2014-01-15 48 views
3

这必须是世界上最简单的东西,但它只是不工作。不能更改代码背后的CssClass

我有一个外部div,我想要应用一个类来使其显示样式=无,以便它隐藏其中的所有内容。它实际上是一个asp:panel元素,所以我假设我可以在后面的代码中设置control.CssClass =“my-hidden-class”。

我实际上将它设置在按钮单击处理程序上(取决于某些条件)但该类从未应用。当我检查Firebug中的div元素时,它甚至没有class属性。它看起来就像它在.aspx标记中一样(当我以声明方式添加它时,实际的css类很好用&)。

此外,我可以看到该类应用,如果我在初始获取请求的prerender方法中设置CssClass。所以我想也许我会把所有的逻辑预渲染,并相应地更新Css类。这也不起作用 - 班级在初始阶段得到了应用,但我无法在随后进行更改。

因此,总而言之,我似乎无法在事件处理程序中应用代码背后的类,并且我只能在预渲染中将其应用于初始获取请求&此值在所有回发中保留。

我在做什么错?

编辑:下面的代码 -

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> 

代码背后:

 protected void PostCodeChange_BtnClick(object sender, EventArgs e) 
    { 
     if (IsValid) 
     { 
      tcrpanel.ApplyPostcodeUpdate(postcode.EnteredPostCode); 
      tcrpanel.TcrUpdatePanel.Update(); 
     } 
     else 
     { 
      TariffContainer.CssClass = "formContentHidden"; 
     } 
    } 

更新 - 按钮单击事件是由用户控制&未来,这是有线了触发更新面板上的更新 - 即发生部分回发。我这样做隐藏&即使所有的服务器端页面事件正在执行我所猜测的页面内容没有得到重新呈现,因此我没有看到包含aspx页面& div显示我的变化。

的解决方案 - 我结束了从服务器喷出一小段JavaScript下来:

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

}

+1

你可以把相关的代码?将有助于确定问题。 – sr28

+0

永远不会有更改代码中的类的问题。你在使用皮肤吗? – afzalulh

+0

@afzalulh - 是的,使用皮肤,但它不应该在这里有任何影响 –

回答

3

怀疑问题在于发生部分回发,其中只有更新面板的内容正在重新呈现。

也就是说,所有的服务器端页面生命周期事件仍然被调用。这让我感到困惑,因为我可以调试并看到正在应用CssClass,但未在html中呈现。只是Asp.Net更新面板的工作方式,我猜。

+0

我有同样的问题,当我删除更新面板时,我能够更改css类,有关如何使更新面板发生这种情况的任何更新? –

+1

我已经更新了我的OP,以显示我如何解决这个问题 –