J
JFoushee
Guest
Hi. Im introducing a Master Page to an existing ASP.NET webpage.
I have JavaScript in the Design Pane of an .aspx file (read: not the code-behind).
aspx file contents
<%@ Page Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="ServiceList.aspx.cs" Inherits="ServiceList" ViewStateMode="Disabled" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="Server
<script type="text/javascript
function ClearAllCheckboxes() {
document.getElementById("chkTeamID").checked = false;
document.getElementById("chkServiceName").checked = false;
document.getElementById("chkServiceType").checked = false;
document.getElementById("chkUsage").checked = false;
}
</script>
<body>
<asp
anel ID="Panel1" runat="server
<asp:Label ID="lblTitle" runat="server" Text="Service Search </asp:Label>
<br />
<table style="width: 691px;
<tr>
<td class="style1
<asp:CheckBox ID="chkTeamID" runat="server" Text="Filter by Team:" />
</td>
<td class="style2
// dropdownlist here
</td>
</tr>
<tr>
<td class="style1
<asp:CheckBox ID="chkServiceType" runat="server"
Text="Filter by ServiceType: " />
</td>
<td class="style2
//dropdown list here
</td>
</tr>
<tr valign="top
<td class="style1
<asp:CheckBox ID="chkServiceName" runat="server"
Text="Filter by ServiceName:" />
</td>
<td class="style2" style="margin-left: 80px
//textbox here
</td>
</tr>
<tr>
<td class="style1
<asp:CheckBox ID="chkUsage" runat="server" Text="Filter by Usage:" />
</td>
<td class="style2" style="margin-left: 80px
//textbox here
</td>
</tr>
</table>
<br />
<asp:Button ID="btnSearch" runat="server" Text="Search by Filters" />
<asp:Button ID="btnViewAll" runat="server" onclientclick="ClearAllCheckboxes()" Text="View All Services" />
<br />
<br />
<asp:Label ID="lblServices" runat="server" Text="lblServices </asp:Label>
<br />
<br />
</aspanel>
</body>
</html>
</asp:Content>
The "View All Services" button functionally unchecks all filters and performs a search.
However, with the implementation of master pages, the page throws an error. When I click the "View All Services" button --which should fire the "ClearAllCheckboxes()" function via onclientclick -- it complains it cannot find an element with those ids.
I understand that master pages add prefixes (eg ctl00$MainContent$) to all my elements.
I also understand I can use "[ComponentName].ClientID" in the code-behind. But this page is not the code-behind.
So,
- Do I need to move this JavaScript to the code-behind? What would that look like?
- Can I keep it in the aspx file? What would that look like?
- Or do I have no other option but to put it the master page?
Continue reading...
I have JavaScript in the Design Pane of an .aspx file (read: not the code-behind).
aspx file contents
<%@ Page Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="ServiceList.aspx.cs" Inherits="ServiceList" ViewStateMode="Disabled" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="Server
<script type="text/javascript
function ClearAllCheckboxes() {
document.getElementById("chkTeamID").checked = false;
document.getElementById("chkServiceName").checked = false;
document.getElementById("chkServiceType").checked = false;
document.getElementById("chkUsage").checked = false;
}
</script>
<body>
<asp
anel ID="Panel1" runat="server <asp:Label ID="lblTitle" runat="server" Text="Service Search </asp:Label>
<br />
<table style="width: 691px;
<tr>
<td class="style1
<asp:CheckBox ID="chkTeamID" runat="server" Text="Filter by Team:" />
</td>
<td class="style2
// dropdownlist here
</td>
</tr>
<tr>
<td class="style1
<asp:CheckBox ID="chkServiceType" runat="server"
Text="Filter by ServiceType: " />
</td>
<td class="style2
//dropdown list here
</td>
</tr>
<tr valign="top
<td class="style1
<asp:CheckBox ID="chkServiceName" runat="server"
Text="Filter by ServiceName:" />
</td>
<td class="style2" style="margin-left: 80px
//textbox here
</td>
</tr>
<tr>
<td class="style1
<asp:CheckBox ID="chkUsage" runat="server" Text="Filter by Usage:" />
</td>
<td class="style2" style="margin-left: 80px
//textbox here
</td>
</tr>
</table>
<br />
<asp:Button ID="btnSearch" runat="server" Text="Search by Filters" />
<asp:Button ID="btnViewAll" runat="server" onclientclick="ClearAllCheckboxes()" Text="View All Services" />
<br />
<br />
<asp:Label ID="lblServices" runat="server" Text="lblServices </asp:Label>
<br />
<br />
</asp
anel></body>
</html>
</asp:Content>
The "View All Services" button functionally unchecks all filters and performs a search.
However, with the implementation of master pages, the page throws an error. When I click the "View All Services" button --which should fire the "ClearAllCheckboxes()" function via onclientclick -- it complains it cannot find an element with those ids.
I understand that master pages add prefixes (eg ctl00$MainContent$) to all my elements.
I also understand I can use "[ComponentName].ClientID" in the code-behind. But this page is not the code-behind.
So,
- Do I need to move this JavaScript to the code-behind? What would that look like?
- Can I keep it in the aspx file? What would that look like?
- Or do I have no other option but to put it the master page?
Continue reading...