0

How do you check if a div's visibility is hidden using JavaScript and ASP.Net?

If you look below, I am using an "if statement" to return an Alert("hi") if the div is not visible. Yet, the code is not working.

Any help is appreciated, thank you. Language is C#/JavaScript

<script>
function emptyRunReportConfirmation() {
var divDateFiltersID = document.getElementById('<%=divDateFilters.ClientID%>'); 

if (divDateFiltersID.style.visibility == "hidden") {
    alert("hi");
}
}
</script>

<!-- this is a button to call the function -->
<asp:Button ID="buttCustomerFilt" runat="server" class="btn btn-primary" ClientIDMode="Static" Text="Run Report" OnClientClick="if ( ! emptyRunReportConfirmation()) return false;" OnClick="buttCustomerFilt_Click" /></div> 

<!-- this is the div to check if visible -->
<div runat="server" id="divDateFilters" visible="false"></div>
Ja va
  • 21
  • 1
  • 9
  • Possible duplicate of [How to check if a div is visible state or not?](http://stackoverflow.com/questions/12353741/how-to-check-if-a-div-is-visible-state-or-not) – tweray Oct 19 '16 at 19:48

1 Answers1

1

Setting visible="false" on a runat="server" element will remove the element entirely from the page. The DIV element will not render at all. You could check your HTML to verify this.

It depends a bit on what you want to do, but in this case if you use visible="false" you can check if the variable is empty to see if the element exists.

if (!divDateFiltersID) {
    alert("hi");
}
becquerel
  • 1,131
  • 7
  • 11
  • When I replaced my code with yours it didn't do the alert on button click however. – Ja va Oct 19 '16 at 17:45
  • And you get no errors in the console? Can you verify that you actually enter the function (using debuging in chrome developer tools for example). There you can also see the values of variables etc. to make sure you are testing for the right things. – becquerel Oct 19 '16 at 17:48
  • 1
    Thank you, Marked up and "answered" – Ja va Oct 19 '16 at 19:34