Forums (Obsolete)

Member

sasdaman - 3/11/2009 9:06:11 AM

CMSListMenu IE6 fix

Hi,

Is it possible to add the below conditional statements to my CMSListMenu web part for it to work correctly in IE6. To achieve this I need to add the conditional statements to the sub UL menu displayed in "Required Rendered HTML"

Conditional statements required for IE 6 to work:

<!--[if lte IE 6]><table><tr><td><![endif]-->
<!--[if lte IE 6]></td></tr></table></a><![endif]-->

Current Rendered HTML:

<div class="pro_linedrop">
	<ul class="CMSListMenuUL" id="menuElem">
		<li class="CMSListMenuLI" id="menuElem_LI_0_1_282"><a href="/home.aspx" class="CMSListMenuLink" >home</a></li>
		<li class="CMSListMenuLI" id="menuElem_LI_0_2_282"><a href="/about-us.aspx" class="CMSListMenuLink" >about-us</a></li>
		<li class="CMSListMenuLI" id="menuElem_LI_0_3_282"><a href="/services.aspx" class="CMSListMenuLink" >services</a></li>
		<li class="CMSListMenuLI" id="menuElem_LI_0_4_282"><a href="/solutions.aspx" class="CMSListMenuLink" >solutions</a>
		<ul class="CMSListMenuUL" id="menuElem_UL_1">
			<li class="CMSListMenuLI" id="menuElem_LI_1_1_286"><a href="/solutions/customer-relationship-management-crm.aspx" class="CMSListMenuLink" >customer-relationship-management-crm</a></li>
			<li class="CMSListMenuLI" id="menuElem_LI_1_2_286"><a href="/solutions/security.aspx" class="CMSListMenuLink" >security</a></li>
		</ul>
		</li>
		<li class="CMSListMenuLI" id="menuElem_LI_0_5_282"><a href="/clients-say.aspx" class="CMSListMenuLink" >clients-say</a></li>
		<li class="CMSListMenuLI" id="menuElem_LI_0_6_282"><a href="/contact.aspx" class="CMSListMenuLink" >contact</a></li>
	</ul>

Required Rendered HTML:

<div class="pro_linedrop">
	<ul class="CMSListMenuUL" id="menuElem">
		<li class="CMSListMenuLI" id="menuElem_LI_0_1_282"><a href="/home.aspx" class="CMSListMenuLink" >home</a></li>
		<li class="CMSListMenuLI" id="menuElem_LI_0_2_282"><a href="/about-us.aspx" class="CMSListMenuLink" >about-us</a></li>
		<li class="CMSListMenuLI" id="menuElem_LI_0_3_282"><a href="/services.aspx" class="CMSListMenuLink" >services</a></li>
		<li class="CMSListMenuLI" id="menuElem_LI_0_4_282"><a href="/solutions.aspx" class="CMSListMenuLink" >solutions</a>
		<ul class="CMSListMenuUL" id="menuElem_UL_1">
<!--[if lte IE 6]><table><tr><td><![endif]-->
			<li class="CMSListMenuLI" id="menuElem_LI_1_1_286"><a href="/solutions/customer-relationship-management-crm.aspx" class="CMSListMenuLink" >customer-relationship-management-crm</a></li>
			<li class="CMSListMenuLI" id="menuElem_LI_1_2_286"><a href="/solutions/security.aspx" class="CMSListMenuLink" >security</a></li>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
		</ul>
		</li>
		<li class="CMSListMenuLI" id="menuElem_LI_0_5_282"><a href="/clients-say.aspx" class="CMSListMenuLink" >clients-say</a></li>
		<li class="CMSListMenuLI" id="menuElem_LI_0_6_282"><a href="/contact.aspx" class="CMSListMenuLink" >contact</a></li>
	</ul>

I've looked into HTML Envelopes or web part containers but not sure if this is the correct way to do this. I saw an earlier post from 2007 where someone had to make changes to the CMSListmenu.cs file to get it to render the output as required.

Any feedback on this will be greatly appreciated.

Kind regards,
Sahus

Kentico Developer

kentico_martind - 3/12/2009 8:46:55 AM

RE:CMSListMenu IE6 fix

Hi Sahus,

You can create copy of CMSListMenu web part (http://devnet.kentico.com/docs/devguide/modifying_the_code_of_standard_web_parts.htm). Then you can change the HTML code generated by CMSListMenu by modifying the 'menuElem.RenderedHTML' property e.g. in OnContentLoaded() method in copied web part's code-behind.

Kind Regards,

Martin Dobsicek

Member

sasdaman - 3/13/2009 8:30:41 AM

RE:CMSListMenu IE6 fix

Martin,

This is interesting. Is this possible in the free edition? I have opened the cmslistmenu.ascx.cs file and the OnContentLoaded procedure. I can add the following property highlighted below:

public override void OnContentLoaded()
    {
 	    base.OnContentLoaded();
        this.menuElem.RenderedHTML = some value
        SetupControl();
    }


    /// <summary>
    /// Initializes the control properties
    /// </summary>
    protected void SetupControl()
    {
        if (this.StopProcessing)
        {
            this.menuElem.StopProcessing = true;
        }
        else
        {
            this.menuElem.ControlContext = this.ControlContext;

            // Set properties from Webpart form
            this.menuElem.ApplyMenuDesign = this.ApplyMenuDesign;
            this.menuElem.UseItemImagesForHiglightedItem = this.UseItemImagesForHiglightedItem;
            this.menuElem.CacheItemName = this.CacheItemName;
            this.menuElem.CacheDependencies = this.CacheDependencies;
            this.menuElem.CacheMinutes = this.CacheMinutes;
            this.menuElem.CheckPermissions = this.CheckPermissions;
            this.menuElem.ClassNames = this.ClassNames;
            this.menuElem.MaxRelativeLevel = this.MaxRelativeLevel;
            this.menuElem.OrderBy = this.OrderBy;
            this.menuElem.Path = this.Path;
            this.menuElem.SelectOnlyPublished = this.SelectOnlyPublished;
            this.menuElem.SiteName = this.SiteName;
            this.menuElem.WhereCondition = this.WhereCondition;
            this.menuElem.CultureCode = this.CultureCode;
            this.menuElem.CombineWithDefaultCulture = this.CombineWithDefaultCulture;

            this.menuElem.CSSPrefix = this.CSSPrefix;
            this.menuElem.HighlightAllItemsInPath = this.HighlightAllItemsInPath;
            this.menuElem.HighlightedNodePath = this.HighlightedNodePath;

            this.menuElem.DisplayHighlightedItemAsLink = this.DisplayHighlightedItemAsLink;
            this.menuElem.DisplayOnlySelectedPath = this.DisplayOnlySelectedPath;
            this.menuElem.FirstItemCssClass = this.FirstItemCssClass;
            this.menuElem.LastItemCssClass = this.LastItemCssClass;
            this.menuElem.HoverCSSClassName = this.HoverCssClassName;
            
            this.menuElem.OnMouseOutScript = this.OnMouseOutScript;
            this.menuElem.OnMouseOverScript = this.OnMouseOverScript; 
            
            this.menuElem.RenderCssClasses = this.RenderCssClasses;
            this.menuElem.RenderItemID = this.RenderItemID;
            this.menuElem.ItemIdPrefix = this.ItemIDPrefix;
            this.menuElem.SubmenuIndicator = this.SubMenuIndicator;
            this.menuElem.UrlTarget = this.UrlTarget;
            this.menuElem.UseAlternatingStyles = this.UseAlternatingStyles;
            this.menuElem.RenderLinkTitle = this.RenderLinkTitle;
            this.menuElem.RenderImageAlt = this.RenderImageAlt;

            this.menuElem.WordWrap = this.WordWrap;

            this.menuElem.HideControlForZeroRows = this.HideControlForZeroRows;
            this.menuElem.ZeroRowsText = this.ZeroRowsText;
            this.menuElem.EncodeMenuCaption = this.EncodeMenuCaption;

            this.menuElem.FilterName = this.FilterName;
        }
    }

However i'm not sure what string value to insert here and where I would then be able to add the conditional statements i.e. in the web part properties page OR do I actually paste the whole entire "Required Rendered HTML" into this string value?

Slightly lost now. Any guidlines on what is required would be greatly appreciated.

Kind regards,
Sahus Pilwal

Kentico Developer

kentico_martind - 3/16/2009 10:08:45 AM

RE:CMSListMenu IE6 fix

Hi Sahus,

The this.menuElem.RenderedHTML property should contain actual HTML generated by the control. You will need to parse it and add your code into appropriate place. You could e.g. try to use Replace function of string object and replace:

<ul class="CMSListMenuUL" id="menuElem_UL_1">

with:

<ul class="CMSListMenuUL" id="menuElem_UL_1">
<!--[if lte IE 6]><table><tr><td><![endif]-->"

etc.

Best Regards,
Martin Dobsicek

Member

sasdaman - 4/9/2009 5:40:31 AM

RE:CMSListMenu IE6 fix

Hi Martin,

I've added the following code to my cmslistmenu.cs file. I've created a string replace function with three parameters. The text to to search which is the rendered HTML > Then what string to find and then > what string to parse/replace it with. I've included this in the OnContentLoaded area but this does not work. I wonder if you have any further thoughts about how I can achieve the addition of IE conditional statements to the CMSlistmenu?

 //Replace string function. 
    public static String Replace(String oText,String oFind,String oReplace) 
    {  
       int iPos=oText.IndexOf(oFind); 
       String strReturn=""; 
       while(iPos!=-1) 
    { 
       strReturn+=oText.Substring(0,iPos) + oReplace; 
       oText=oText.Substring(iPos+oFind.Length); 
       iPos=oText.IndexOf(oFind); 
    } 
       if(oText.Length>0) 
       strReturn+=oText; 
       return strReturn; 
    }

    public override void OnContentLoaded()
    {
    base.OnContentLoaded();
        String ConFind = "<ul class="+"CMSListMenuUL"+" id="+"menuElem_UL_1"+">";
        String ConReplace = "<ul class="+"CMSListMenuUL"+"id="+"menuElem_UL_1"+"><!--[if lte IE 6]><table><tr><td><![endif]-->";
        Replace(this.menuElem.RenderedHTML, ConFind, ConReplace);
        SetupControl();
    }

As always any help would be greatly appreciated.

Kind regards,
Sahus Pilwal


Kentico Support	kentico_jurajo - 5/18/2009 7:52:43 AM RE:CMSListMenu IE6 fix Hi, I am sorry for the delay. Could you please try to run your code in OnPreRender event? I think it is too soon in OnContentLoaded. Moreover, you may need to set this property CMS.Controls.CMSListMenu.LoadDataAutomaticaly to false after you have replaced the strings. I hope it will help. Best Regards, Juraj Ondrus


Member	thilag_80-yahoo - 9/1/2009 7:15:25 PM RE:CMSListMenu IE6 fix Hi I saw your post.I need your help with renderedHTML.How you could see the RenderedHTML code.And how to set this property.I couldnt see any UL,LI tags.I am the beginner of Kentico as well as asp.net.Please advice me

Kentico Developer

kentico_martind - 9/15/2009 4:54:37 AM

RE:CMSListMenu IE6 fix

Hello,

You can see the code in this property if you debug the menu web part's code-behind. You can also see HTML code generated by control in HTML source code of the page in your browser.

Basically you can change the property in e.g. following way:

this.menuElem.RenderedHTML = this.menuElem.RenderedHTML.Replace("originalText", "newText");

e.g. if you would want to add custom style attribute for <ul class="CMSListMenuUL" id="Vertical"> tag generated by menu, you could use sample code bellow:

this.menuElem.RenderedHTML = this.menuElem.RenderedHTML.Replace("<ul class="CMSListMenuUL" id="Vertical">
", "<ul class="CMSListMenuUL" id="Vertical" style="color: red;">
");

You can also use regular expressions to parse the HTML code in this property.

Best Regards,
Martin Dobsicek

Certified Marketer 13

Jeroen Fürst - 1/5/2010 5:38:18 AM

RE:CMSListMenu IE6 fix

Hi,

When I add the RenderedHTML property in the OnContentLoaded event like you suggested nothing happens.

Is this the correct place to put it? The manual says that it should be placed before the prerender.

I also wonder if LoadDataAutomaticaly should allways be set to false (like Juraj suggested).

Can you verify this for KenticoCMS 4.1?

Cheers!
Jeroen

Kentico Developer

kentico_martind - 1/15/2010 6:12:48 AM

RE:CMSListMenu IE6 fix

Hi Jeroen,

Yes, it is necessary to set LoadDataAutomaticaly to false, but you need to set it after you change RenderedHTML property, e.g. following code works even when placed in OnContentLoaded method in version 4.1:

        this.menuElem.RenderedHTML = "xxx" + this.menuElem.RenderedHTML;
        this.menuElem.LoadDataAutomaticaly = false;

I'm sorry I forgot to mention this.

Best Regards,
Martin Dobsicek