Keep div displayed on postback

Question

I have a web user control and a div inside it; some jQuery toggles div's visibility. There is also a asp:button that launches some server side code.

I need to restore div's visibility after postback.

I'm following the updated solution posted in the this post's solution. Here is my code:

At the top of the ascx, after the Registers:

<script>
function SetHiddenValue()
{        
   var campo = document.getElementById("<% =hidHiddenField.ClientID %>");
   if(campo.Value == "NO")
   {               
      document.getElementById("<% =hidHiddenField.ClientID %>").Value = "SI";  
   }
   else
   {
      document.getElementById("<% =hidHiddenField.ClientID %>").Value = "NO";
   }        
}
</script>

The div definition:

<div id="divContenidoMetricas" style='<%= DefinirVisibilidad() %>'>

In that same web user control:

<asp:ImageButton runat="server" ImageUrl="~/Themes/Images/buscar.PNG" OnClick="btnFiltrar_Click"
                    ID="btnFiltrar" OnClientClick="SetHiddenValue()" />

In the ascx.cs:

protected string DefinirVisibilidad()
{
   return this.hidHiddenField.Value == "SI" ? "display:block" : "display:none";
}

It is just not working. hidHiddenField.Value arrives to the server code (DefinirVisibilidad()) with the same value all the times.

Thanks so much in advance for your help... my client side code knowledge is kind of damaged by ASP.NET so I'm stuck.

SOLVED

I replaced 'Value' with 'value' and that solved the problem. It's working!

If using ASP.NET Ajax you could use the [AlwaysVisibleControl-Extender](http://www.asp.net/ajaxlibrary/AjaxControlToolkitSampleSite/AlwaysVisibleControl/AlwaysVisibleControl.aspx). — Tim Schmelter, Nov 08 '11 at 17:20
Are you sure of your `SetHiddenValue` function? It just puts "SI" in the hidden field if its current value is "NO", and "NO" in all other cases... I don't get it. — Rodolphe, Nov 08 '11 at 17:23
@Rodolphe, its like campo.Value = !campo.Value ... since hidden value is string instead of boolean, I did it that way. (SI = YES, NO = NO) — daniloquio, Nov 08 '11 at 18:20
@TimSchmelter, thanks for your suggestion. My problem is a server side button inside the hiding div. I need to mantain visibility status after postback, so using the AlwaysVisibleControl-Extender wont solve my problem. — daniloquio, Nov 08 '11 at 18:23

Rodolphe · Answer 1 · 2011-11-08T18:43:12.583

1

Try this, please:

function SetHiddenValue()
{        
   var campo = document.getElementById("<% =hidHiddenField.ClientID %>");
   var display = document.getElementById("divContenidoMetricas").style.display;

   if(display == "block")
   {               
      campo.value = "SI";  
   }
   else
   {
      campo.value = "NO";
   }        
}

EDIT: Replaced "Value" with "value".

edited Nov 08 '11 at 18:43

answered Nov 08 '11 at 17:28

Rodolphe

1,689
1
15
32

score 0 · Answer 2 · answered Nov 08 '11 at 17:20

0

How about using jQuery to set it on document ready?

$(document).ready(function() {
  var showDiv = <%= DefinirVisibilidad() %>;
  if (showDiv != true) {
    $('#divContenidoMetricas').hide();
  }
});

Instead of setting the style directly using <% %> blocks.

answered Nov 08 '11 at 17:20

Balthy

866
6
3

From what I understood the problem is server-side. – Rodolphe Nov 08 '11 at 17:25

score 0 · Accepted Answer · answered Nov 15 '11 at 16:10

Value has to be lowercase, so it worked after replacing:

   if(campo.value == "NO")
   {               
      document.getElementById("<% =hidHiddenField.ClientID %>").value = "SI";  
   }
   else
   {
      document.getElementById("<% =hidHiddenField.ClientID %>").value = "NO";
   }

Keep div displayed on postback

3 Answers3