2014-01-15 2 views
3

Это должно быть самое простое в мире, но оно просто не работает.Невозможно изменить CssClass Из кода

У меня есть внешний div, к которому я хочу применить класс, чтобы сделать его стиль отображения = none, чтобы он скрывал весь контент внутри него. Это фактически элемент asp: panel, поэтому я предполагаю, что могу просто установить control.CssClass = «my-hidden-class» в коде позади.

Я на самом деле устанавливаю это на обработчик кнопки (в зависимости от определенных условий). Но класс никогда не применяется. Когда я проверяю элемент div в Firebug, он даже не имеет атрибута класса. Он отображается точно так же, как и в разметке .aspx (фактический класс css - штраф & применяется, когда я добавляю его декларативно).

Кроме того, я могу увидеть класс, применяемый, если я установил CssClass в методе prerender в первоначальном запросе на получение. Поэтому я подумал, что, возможно, я положу всю логику в prerender и соответственно обновить Css-класс. Это также не работает - класс применяется к начальному состоянию, но я не могу его впоследствии изменить.

Итак, чтобы подвести итог, кажется, что я не могу применить класс от кода, находящегося во всем в обработчике событий, и я могу применить его только в prerender для запроса intial get &, это значение сохраняется на всех обратных передачах.

Что я делаю неправильно?

Edit: Вот код -

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

Update - событие нажатия кнопки происходит из пользовательского элемента управления & это проводные вверх для запуска обновления на панели обновления - т.е. происходит частичная обратная передача. Я делаю это, скрывая &, показывая div в содержащейся странице aspx &, несмотря на то, что все события на стороне сервера выполняются. Я предполагаю, что содержимое страницы не будет перерисовываться, поэтому я не вижу мои изменения.

Решение - Я в конечном итоге брызгали немного 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, чтобы показать, как я исправил это –

Смежные вопросы