[CLOSED] Label Html issue

  1. #1

    [CLOSED] Label Html issue

    I have some html that displays fine in the HTML editor and then I take that string and displaying tot he user in Label using Label1.Html = string. However, list such as <ul> and <ol> are not displayed properly in the Label.

    here is sample page. do I have to include some styles for the label to work.
    thanks

    
    
    
    <%@ Page Language="C#" %>
    
    
    <%@ Register assembly="Coolite.Ext.Web" namespace="Coolite.Ext.Web" tagprefix="ext" %>
    
    
    
    
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    
    
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    
    <script runat="server">
    
    
    protected void Page_load(object sender, EventArgs e)
    
    
    {
    
    
    string s = "<ul><li>asdasd</li><li>adadas</li><li>asdasdsa</li></ul><br />Credit Incentive Program (CIP) Tracker<br /><br /><br />";
    
    
    s += "<p align='left'>CO is committed to establishing a strategic partnership with our members to provide maximum protection, help control losses and positively impact the overall cost of property and liability and workers' compensation coverage through the Credit Incentive Program.&amp;nbsp; </p>";
    
    
    s += "<p align='left'>Credit incentives of up to 15 points (excluding bonus points) can be earned based on an Agency's participation in meeting the following program guidelines. One CIP point is equal to a 1% discount on the Agency's applicable net premium. Within each track, participating members may choose among various options to reach the maximum points allowable within that track. Please note the maximum total a member can receive is 15 points (excluding bonus points)</p>";
    
    
    s += "<p align='left'>For P/L Program members, points earned after March 31, 2010 will be applied to the next program year.&amp;nbsp; For Workers' Compensation Program members, points earned after June 30, 2010 will be applied to the next program year.</p>";
    
    
    s += "<p align='left'>This program is provided through Online to allow you, the Member, to to perform two functions for CIP's earned during the current program Year:</p>";
    
    
    s += "<ol>";
    
    
    s += "<li><p align='left'>To view the Credits that have been recorded by CO for the current program year.&amp;nbsp; (Activities that have grey check marks have been recorded as earned.)</p></li>";
    
    
    s += "<li><p align='left'>To estimate total discount that will be applied in a &amp;quot;what if&amp;quot; scenario by selecting individual CIP Activities.&amp;nbsp; (These are for estimating purposes only.&amp;nbsp; All discounts will be accepted and verified <strong><em>only</em></strong> by CO)</p></li>";
    
    
    s += "</ol>";
    
    
    s += "<br /><br />";
    
    
    s += "<p align='left'>For questions regarding point credits, please call CO Chief Risk Officer .<br />For information regarding the Credit Incentive Program, please call CO Claims Assistant .</p>";
    
    
    
    
    
    lbl2.Html = Server.HtmlDecode(s);
    
    
    }
    
    
    </script>
    
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    
    
    <head id="Head1" runat="server">
    
    
    <title>Label Control Variations - Coolite Toolkit Examples</title>
    
    
    <link href="../../../../resources/css/examples.css" rel="stylesheet" type="text/css" />
    
    
    
    
    
    <style type="text/css">
    
    
    
    
    
    /*
    
    
    ol 
    
    
    {
    
    
    list-style-position: inside;
    
    
    list-style-type: upper-roman !important ;
    
    
    color: #999999 !important ;
    
    
    }
    
    
    ol p 
    
    
    {
    
    
    padding-left:6px !important ; 
    
    
    font-family: Tahoma !important ;
    
    
    font-size: 12px !important;
    
    
    font-weight:bold !important;
    
    
    color: #666666 !important ;
    
    
    }
    
    
    */
    
    
    
    
    
    </style>
    
    
    </head>
    
    
    <body>
    
    
    <ext:ScriptManager ID="ScriptManager1" runat="server" />
    
    
    
    
    
    <h1>Label Control Variations</h1>
    
    
    
    
    
    <h2>1. Simple label</h2> 
    
    
    <ext:Label runat="server" Text="Label" />
    
    
    
    
    
    <h2>2. Html label</h2> 
    
    
    <ext:Label runat="server" ID="lbl2" />
    
    
    
    
    
    <h2>3. Label with icon</h2> 
    
    
    <ext:Label runat="server" Text="Label" Icon="Note" />
    
    
    
    
    
    <h2>4. Label with right-align icon</h2> 
    
    
    <ext:Label ID="Label1" runat="server" Text="Label" Icon="Note" IconAlign="Right" /> 
    
    
    
    
    
    </body>
    
    
    </html>
  2. #2

    RE: [CLOSED] Label Html issue

    Hi,

    Ext resets the browser's stylesheet to a standard setting to ensure a level playing field across all browsers so that it can create pixel-perfect layouts.

    The principle is outlined here: http://developer.yahoo.com/yui/reset/

    Part of this is to remove the default styling of <LI> elements.

    To style your <LI> elements, use a CSS rule which selects the elements you wish to style.

    See http://www.w3.org/TR/CSS21/generate....def-list-style

    You can avoid this problem in 1.0 version
    in v1.0 there is a new property called PreventBodyReset (Panel's property) which resets the native css classes back to expected results when adding to the <Content> Template.

    http://www.extjs.com/deploy/dev/docs...eventBodyReset

    Here is the sample which shows how restore ul bullets in 0.8.2

    <%@ Page Language="C#" %>
    
    <%@ Register assembly="Coolite.Ext.Web" namespace="Coolite.Ext.Web" tagprefix="ext" %>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        
        <style type="text/css">
            .fix-list li{
               list-style: circle;
            }
            
            .fix-list ul{
               padding-left:20px;
            }
        </style>
    </head>
    <body>
        <form runat="server">
            <ext:ScriptManager runat="server" />
            
            <ext:Label ID="Label1" runat="server" Cls="fix-list" Html="<ul><li>asdasd</li><li>adadas</li><li>asdasdsa</li></ul>" />
        </form>
    </body>
    </html>
  3. #3

    RE: [CLOSED] Label Html issue

    Thanks vlad. please mark as solved.
  4. #4

    RE: [CLOSED] Label Html issue

    is there any way to resolve this in v0.8.2 without having to reset the style that coolite has implemented? i mean like to a preventBodyReset? i have tried adding a class "x-panel-normal" to my main div but it doesn't seem to work

Similar Threads

  1. [CLOSED] Html code to Ext:label
    By canbay in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Jul 26, 2012, 1:08 PM
  2. Problem with set Html in Label
    By manhhoangxuan in forum 1.x Help
    Replies: 12
    Last Post: Mar 29, 2012, 10:32 PM
  3. [CLOSED] Label.setText HTML
    By supera in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: Jan 27, 2012, 12:31 PM
  4. Replies: 2
    Last Post: Nov 03, 2011, 5:24 PM
  5. unescape label html
    By [WP]joju in forum 1.x Help
    Replies: 0
    Last Post: Apr 15, 2010, 3:11 AM

Posting Permissions