Master Page -CSS class change

Question

Dear Friends I have a main menu in master page as below 123l Reports About Us It will navigate to Reports.aspx if we click on Reportswhich is using same mater page Now how can I make below for new page 123l Reports so that my current page will get current page attributes Thanks Praveen

Wim Sturkenboom · Answer

The css that you posted in your last post works with the code I gave you; no changes required. I get Reports in bold for webform1.aspx and About Us in bold for webform2.aspx As indicated in my earlier post you need to change MyMasterPage to the name of your masterpage. I'm not a javascript person so can't really advise.

Wim Sturkenboom · Answer

Just regarding the fact that MyMasterPage is unknown: yes that is what my master page for the example is called (MyMasterPage.master). Replace MyMasterPage everywhere in my code with the name of your masterpage (without the master extension; e.g. Site for site.master). I will see if I can find time tomorrow to come up with a solution for the css that you gave.

PRAVEEN MACHAT · Answer

Dear Friend First of all I am a beginner  That is why these much doubts Please understand. I am trying to create a website with a good menu bar . If you could advise any better way to get good menu(using javascript) It will be very helpful Thank you for your help but I have few concerns . 1. MyMasterPage is not get identified in name space  Please see the attachment 2. Below is css for menu  If we give ID for individual items I need to define each class over here. /* Menu */ #menu { width: 962px; height: 50px; margin: 0 auto; } #menu ul { margin: 0; padding: 0; list-style: none; } #menu li { display: block; float: left; } #menu a { display: block; float: left; height: 38px; padding: 8px 20px 0 20px; text-decoration: none; text-transform: none; color: #000000; } #menu a:hover { text-decoration: underline; } #menu .current_page_item { background: url(../images/img05.gif) no-repeat; } #menu .current_page_item a { background: url(../images/img06.gif) no-repeat right top; font-weight: bold; }

Wim Sturkenboom · Answer

Modified version of your menu Log Call Reports About Us Each menu item has its own id (with a sensible name). Code for webform1.aspx.cs using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; namespace WebMenuWithHighlightingCurrentpage { public partial class WebForm1 : System.Web.UI.Page { protected void Page_Load(object sender EventArgs e) { MyMasterPage mp = (MyMasterPage)Page.Master; System.Web.UI.HtmlControls.HtmlGenericControl ctrl; ctrl = (System.Web.UI.HtmlControls.HtmlGenericControl)mp.FindControl(menu_reports); if (ctrl != null) { // option 1 ctrl.Attributes.Remove(class); ctrl.Attributes.Add(class current_page_item); // option 2 //ctrl.Attributes.Add(style background-color:yellow); } } } } Code for webform2.aspx.cs using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; namespace WebMenuWithHighlightingCurrentpage { public partial class WebForm2 : System.Web.UI.Page { protected void Page_Load(object sender EventArgs e) { MyMasterPage mp = (MyMasterPage)Page.Master; System.Web.UI.HtmlControls.HtmlGenericControl ctrl = (System.Web.UI.HtmlControls.HtmlGenericControl)mp.FindControl(menu_aboutus); if (ctrl != null) { // option 1 ctrl.Attributes.Remove(class); ctrl.Attributes.Add(class current_page_item); // option 2 //ctrl.Attributes.Add(style background-color:yellow); } } } } The masterpage is now called MyMasterPage; adjust to your needs.

PRAVEEN MACHAT · Answer

Log Call Reports About Us --%> this is my div

Wim Sturkenboom · Answer

In the page load event of the page (not the master page).

PRAVEEN MACHAT · Answer

Where I need to write this code ?

Wim Sturkenboom · Answer

Same principle System.Web.UI.HtmlControls.HtmlGenericControl ctrl = (System.Web.UI.HtmlControls.HtmlGenericControl)masterpage.FindControl(li_1_1); if (ctrl != null) { // option 1 ctrl.Attributes.Remove(class); ctrl.Attributes.Add(class class2); // option 2 //ctrl.Attributes.Add(style background-color:yellow); } Option 1 first removes any existing stylesheet class from the control (if any) and next applies the css style defined in class2 ( current_page_item in your example). Alternatively you can add a style (as shown in the line that is commented out); this will (in my example) override the background-color attribute. Note that control is now a HtmlGenericControl instead of a standard control.

PRAVEEN MACHAT · Answer

Sorry Sir What I meant was different....... Please find attachment..... As In attachment  for each page I have to highlight current page (I am using image for that) in css class  current_page_item  I had write code for it. For example : If I am logcall page  it will be highlighted and If i click on other link report it will navigated to report page . now I want to highlight report page But I dont know how to do it Now I am using different master page to each page  I need to avoid it I believe now it is clarified Please help me out ....... Thank you in advance

Wim Sturkenboom · Answer

Quick example of the second approach; my masterpage is called dsrp .master. The markup that I used in the masterpage hallo The code in default.aspx.cs page_load // determine the masterpage of the page dsrp masterpage = ( dsrp )Page.Master; // find menu item to hide Control ctrl = masterpage.FindControl(li_1_1); if (ctrl != null) { // hide it ctrl.Visible = false; }

Wim Sturkenboom · Answer

If I understand you correctly you want Report.aspx to have a different menu from other pages (without the 'about us'). Simplest would be to give Reports.aspx its own master page where 'about us' is missing; it defeats the purpose of using masterpages a little but I personally consider this acceptable (as long as you don't end up with tens or hundreds of masterpages). Alternative is to give your menu items IDs and hide what you don't need from the code behind. I have not tested either approach.