April, 2011

...now browsing by month


Manipulate master page from content page

Thursday, April 14th, 2011

I have a admin.master master page that is shared by several content pages. On the master page, I have a set of side-bar menus that get loaded dynamically from a xml file via a WebuserControl, this part of codes look like this:

<div id="LeftSideMenu" style="height:100%;">

<uc3:SideMenuXml ID="mnuCalendar" runat="server" MenuName="Calendar" />           <uc3:SideMenuXml ID="mnuUser" runat="server" MenuName="User" />


In the SideMenuXml.ascx, codes behind load xml content properly based on the MenuName which corresponds to a segment in the xml file that looks like this:



<Name>School Calendar</Name>


<Description>View school calendar</Description>





This has been working great, but sometimes I want a different set of side menus loaded into admin.master based on the purpose of the content page. Today, I learned that this can be accomplished by these steps:

  1. Create a public property in the master page, named “PageType” or whatever
  2. To access this property of master page, I needed to add this attribute to the content page, <%@ MasterType VirtualPath=”~/Admin.master” %>
  3. Then on the Page_Init event of my content page, I set this property to an enum value I wanted: protected void Page_Init(object sender, EventArgs e)    {        Master.PageType = MasterPageTypes.Contest;
  4. Then on the admin.master I added this line of server-client-mixed code:
    <div id="LeftSideMenu" style="height:100%;">
    <% if (PageType== MasterPageTypes.Contest) {%>
    <uc3:SideMenuXml ID="mnuContest" runat="server" MenuName="Contest" />
    <% } %>

With that, I accomplished the goal of showing certain Contest related side menu for those content pages that set the PageType property of admin.master master page.

To sum it up, public property of master page is not accessible from its content page until you add this MasterType directive to the content page that uses the master: <%@ MasterType VirtualPath=”~/Admin.master” %>

Retrieve dropdown list’s selected text in jQuery

Monday, April 11th, 2011

Often times there is need to access a DropDown list control’s selected text from client side; for example, this server control has a server id “ddlSubject”, how would you access its selected text using jquery? I thought this was trivial, using $(“[id$=’ddlSubject’]”).text() would do, as $(“[id$=’ddlSubject’]”).val() I knew would give me the selected value. Wrong!!. As matter of fact, $(“[id$=’ddlSubject’]”).text() returned all the option texts, not just the selected text.

Well, as it turned out, what’s really working is to use $(“[id$=’ddlSubject’] option:selected”).text();