I have an ASPX page with 3 HTML Buttons that all fire the same JS function along with a single parameter. The buttons pass the id of a DIV and the function shows/hides that DIV.
I can get this to work if it is one function for each button (with hard coded value) but I can't seem to figure out how to make it so the function accepts the ClientID as a parameter.
<button id="a_button" onclick="Show_Hide_Display('<%=section_a.ClientID%>');return false">Section A</button>
<button id="b_button" onclick="Show_Hide_Display('<%=section_b.ClientID%>');return false">Section B</button>
<button id="c_button" onclick="Show_Hide_Display('<%=section_c.ClientID%>');return false">Section C</button>
<script type="text/javascript">
function Show_Hide_Display(divID) {
var div = document.getElementById(divID);
if (div.style.display == "" || div.style.display == "block") {
div.style.display = "none";
}
else {
div.style.display = "block";
}
return false;
}
</script>
I have tried severl things including the above, which results in:
TypeError: Div is null
EDIT:
This is where the DIVs that will be shown/hidden are built (in a DIV below the DIV containing the buttons, above the JavaScript).
<div id="pdp_section_a_intro" class="pdp_section_a_intro" runat="server">
<h2>Section A</h2>
<div id="section_a" Class="pdp_section" runat="server" style="display:none;">
<asp:PlaceHolder ID="pdp_subssections_a_ph" runat="server"></asp:PlaceHolder>
</div>
</div>
<div id="pdp_section_b_intro" class="pdp_section_b_intro" runat="server">
<h2>Section B</h2>
<div id="section_b" Class="pdp_section" runat="server">
<asp:PlaceHolder ID="pdp_subssections_b_ph" runat="server"></asp:PlaceHolder>
</div>
</div>
<div id="pdp_section_c_intro" class="pdp_section_c_intro" runat="server">
<h2>Section C</h2>
<div id="section_c" Class="pdp_section" runat="server">
<asp:PlaceHolder ID="pdp_subssections_c_ph" runat="server"></asp:PlaceHolder>
</div>
</div>
When you use any server side control, you cannot embed server side code inside. Can you please try below,
In ASPX page,
<asp:Button ID="btn1" runat="server" Text="Button 1" />
<asp:Button ID="btn2" runat="server" Text="Button 2" />
<asp:Button ID="btn3" runat="server" Text="Button 3" />
In Code Behind,
btn1.Attributes.Add("onclick", "Show_Hide_Display('" & section_a.ClientID & "');return false;")
btn2.Attributes.Add("onclick", "Show_Hide_Display('" & section_b.ClientID & "');return false;")
btn3.Attributes.Add("onclick", "Show_Hide_Display('" & section_c.ClientID & "');return false;")
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.