Hi Hans,

I have removed the references to the CommonLibrary and am now usng SmartWebResources.  This has things mostly working.  However, I am initiallty trying to get the application running in IE8.  Based on what you said above, and also what I've read in other discussions, I've set the RenderingMode to Quirks. I'm also using a ComboMode of MultipleColumns.  The most obvious issue that I'm having now is the style specified for the columns by using LayoutSettings.ColumnStyle.CssClass = "myClass".  This seems to work fine in Chrome but the syle doesn't get applied in IE8.

Other than the RenderingMode, is there anything that is needed to support IE8?  I've seen where others have reported issues with IE8 but haven't found a good answer as to what to do.

UPDATE: To be more specific, I am attempting to style the WebCombo by using the available styles in LayoutSettings.  Here is what I'm doing:

		combo.LayoutSettings.ComboMode = Mode.MultipleColumns;
                combo.LayoutSettings.StatusBoxPosition = BoxPosition.Top;
                combo.LayoutSettings.MoreButtonStyle.Normal.CssClass = "comboMoreMini";
                combo.LayoutSettings.MoreButtonStyle.Over.CssClass = "comboMoreOverMini";
                combo.LayoutSettings.FrameStyle.Normal.CssClass = "comboFrameMini";
                combo.LayoutSettings.FrameStyle.Active.CssClass = "comboFrameMini";
                combo.LayoutSettings.FrameStyle.Over.CssClass = "comboFrameOverMini";
                combo.LayoutSettings.TextBoxStyle.Normal.CssClass = "comboTextBoxMini";
                combo.LayoutSettings.TextBoxStyle.Active.CssClass = "comboTextBoxMini";
                combo.LayoutSettings.TextBoxStyle.Over.CssClass = "comboTextBoxOverMini";
                combo.LayoutSettings.RowStyle.Normal.CssClass = "comboRowMini";
                //combo.LayoutSettings.RowStyle.Over.CssClass = "comboRowOverMini";
                combo.LayoutSettings.ResultBoxStyle.CssClass = "comboResultBoxMini";
		combo.LayoutSettings.HeaderStyle.CssClass = "comboHeaderMini";
		combo.LayoutSettings.StatusBoxStyle.CssClass = "comboStatusBoxMini";
		combo.LayoutSettings.SelectedRowStyle.CssClass = "comboSelectedRowMini";
		combo.LayoutSettings.ResultFrameStyle.CssClass = "comboResultFrameMini";
		combo.LayoutSettings.ColumnStyle.CssClass = "comboColumnMini";
		combo.LayoutSettings.ResultBoxHeight = 360;

 My ColumnStyle has border: solid 1px #cccccc; which works fine in Chrome but not in IE8.  Also, if I set the RowStyle.Over.CssClass to be anything different from RowStyle.Normal.Class, the row loses it's styling, even if the stle contents are the same as in:

.comboRowMini { background-color:#FFFFFF; height: 20px; }
.comboRowOverMini { background-color:#FFFFFF; height: 20px; }

 I am trying to enable the row highlighting when hover over a row.  This works fine if I use the default style.  I just can't seem to make it work when I style the control.  I assumed it would be controlled with the RowStyle.Over property.  I have found no documentation for the Over, Normal and Active properties.  I assume they correspond to hover, non-focus and focus.

Thanks,

Keith

Hi Keith,

I have tried to replicate your issue in our local end. Unfortunately, I couldn't replicate this issue in our local end. I'm using WebCombo 6 in IE8 with Quirks rendering mode. I also using HTML4 as doctype of my page. By using your description above, I can make my resultbox's column has 1px border and each row have white background for normal and hover by using CssClass property. Here's the screenshot:

http://www.mediafire.com/?hq1xunn0cyactb9

Is there any simple sample that can replicate this issue in our local end? I will gladly help you to trace this problem. Look forward to hear any feedback from you so I can help you further.

Regards,
Bernard

It appears to be an issue mainly when using a ResultBoxWindowType of Popup.  When I set this to Normal, most of the style issues are fixed.  However, our application currently has the WebCombo in a IFrame and will not work properly unless the type is set to Popup.  The application is currently only used in IE 8.  So, I have to make it work for that.  In the near future, it will be migrated to IE9 and 10.  I'll have more flexibility then.

I'm trying to create a sample application to show what I'm seeing but it appears to work differently.  I'm getting script errors when the WebCombo page is placed inside an IFrame and the ResultBoxWindoType = Normal.  However, even if I don't run it in an IFrame, the columns seem to lose their width when I hover over the rows.  The first column expands to take up 100% of the results box.

I'll keep looking and try to post an example later today.

UPDATE: I've also been unable to get the currently selected row to be highlighted.  And one other thing, in my existing application using the old version of WebCombo, when I move down the rows either by using the down arrow or mouse wheel, when I get to the last row, I get a postback to load more data.  Using version 6.0, I can't seem to get this to work and must click the more button to get this to happen.  How can this be enabled?

I'm including a simple example for your review.  Again, I am trying to get this to work in IE8.  I don't seem to have as many problems in Chrome.  It mostly looks ok as it is in the example.  If you comment out the UseDefaultStyle, you will see that the styles get lost.

I'll just put the code here.  The Default.aspx page contains the WebCombo.  I have a Container.aspx page that embeds Default.aspx in an iframe.

web.config

<?xml version="1.0"?>

<!--
  For more information on how to configure your ASP.NET application, please visit
  http://go.microsoft.com/fwlink/?LinkId=169433
  -->
<configuration>
    <configSections>
    </configSections>
    <appSettings file="">
        <clear />
        <add key="ISNet.WebUI.ISRes_Registered" value="true"/>
        <add key="ISNet.WebUI.WebCombo.v6_0_7200.RenderingMode" value="Quirks"/>
        <add key="ISNet.WebUI.WebCombo.v6_0_7200.ViewStateStorage" value="None" />
        <add key="ISNet.WebUI.WebCombo.v6_0_7200.ViewStateItems" value="Behavior" />
        <add key="ISNet.WebUI.WebCombo.v6_0_7200.CachePriority" value="Normal" />
        <add key="ISNet.WebUI.WebCombo.v6_0_7200.RunTimeLicenseKey" value="?????-????-?????" />
    </appSettings>
    <system.web>
        <httpRuntime targetFramework="4.5" />
        <compilation debug="true" targetFramework="4.5">
            <assemblies>
                <add assembly="ISNet.WebUI, Version=3.0.5000.1, Culture=neutral, PublicKeyToken=B1F2A8511635667A"/>
                <add assembly="ISNet, Version=3.0.5000.1, Culture=neutral, PublicKeyToken=B1F2A8511635667A"/>
            </assemblies>
        </compilation>
        <httpHandlers>
            <add path="ISRes.axd" verb="GET" type="ISNet.WebUI.WebResourceHandler, ISNet.WebUI, Version=3.0.5000.1, Culture=neutral, PublicKeyToken=b1f2a8511635667a" validate="true"/>
        </httpHandlers>
    </system.web>
    <system.webServer>
        <validation validateIntegratedModeConfiguration="false"/>
        <handlers>
            <add name="ISRes.axd_GET" path="ISRes.axd" verb="GET" type="ISNet.WebUI.WebResourceHandler, ISNet.WebUI, Version=3.0.5000.1, Culture=neutral, PublicKeyToken=b1f2a8511635667a" preCondition="integratedMode"/>
        </handlers>
    </system.webServer>
</configuration>

Styles.css

body { padding:0px; margin: 0px;}
.comboFrameMini { background-color:#FFFFFF;border-color:#999999;border-width:1px;border-style:solid;}
.comboFrameOverMini { background-color:#FFFFFF;border-color:#999999;border-width:1px;border-style:solid;}
.comboTextBoxMini { background-color:#FFFFFF;border-width:0px;border-style:none; font-family:Verdana;  font-size:8pt;  font-weight:normal; color:#000000;}
.comboTextBoxOverMini { background-color:#FFFFFF;border-width:0px;border-style:none; font-family:Verdana;  font-size:8pt;  font-weight:normal;}
.comboSearchSpanMini { background-color:#999999; font-family:Webdings;  font-size:9pt;  font-weight:normal;color:#E9EBF4;cursor:Hand;}
.comboSearchSpanOverMini { background-color:#999999; font-family:Webdings;  font-size:9pt;  font-weight:normal;color:#E9EBF4;cursor:Hand;}
.comboMoreMini { background-color:#FFFFFF;border-color:#FFFFFF;border-width:1px;border-style:solid;}
.comboMoreOverMini { background-color:#E9EBF4;border-color:#B0C4DE;border-width:1px;border-style:solid;}
.comboRowMini { background-color:#FFFFFF; height: 20px; }
.comboRowOverMini { background-color:#FFFFFF; height: 20px; }
.comboResultBoxMini {  background-color:#FFFFFF;font-family:Verdana;  font-size:8pt;  font-weight:normal;border-collapse:collapse;}
.comboResultFrameMini { background-color:#FFFFFF;border-color:#666666;border-width:1px;border-style:solid;height:1000px;}
.comboStatusBoxMini { background-color:#858585; font-family:Verdana;  font-size:8pt;  font-weight:normal;color:#ffffff;}
.comboHeaderMini { background-color:#E7F0F8; font-family:Verdana;  font-size:8pt;  font-weight:bold;color:#000000;border-right: aliceblue 1px solid; padding:3px 3px 3px 3px ;}
.comboColumnMini { background-color:#FFFFFF; text-overflow: ellipsis; overflow: hidden; padding:3px 3px; border-width:1px; border-style:solid; border-color: #cccccc; }
.comboSelectedRowMini { background-color:#FFFFCC; color:#000000;font-family:Verdana;  font-size:8pt;  font-weight:normal;height: 20px;}

Default.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebComboTest.Default" %>
<!DOCTYPE HTML PUBLIC ""-//W3C//DTD HTML 4.0 Transitional//EN"">
<html>
<head id="Head1" runat="server">
    <link rel="stylesheet" type="text/css" href="Styles.css">
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:PlaceHolder ID="wc" runat="server"></asp:PlaceHolder>
        </div>
    </form>
</body>
</html>

Default.aspx.cs

using ISNet.WebUI.WebCombo;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace WebComboTest
{
    public class Default : System.Web.UI.Page
    {
        protected PlaceHolder wc;
        public class KeyAndValue
        {
            public string Key { get; set; }
            public int Value { get; set; }
        }
        List<KeyAndValue> data = new List<KeyAndValue>();
        protected void Page_Load(object sender, EventArgs e)
        {
            WebCombo combo = new WebCombo("combo");
            SetLayout(combo);
            combo.Width = Unit.Pixel(250);
            combo.InitializeDataSource += combo_InitializeDataSource;
            combo.InitializeLayout += combo_InitializeLayout;
            wc.Controls.Add(combo);
            LoadData();
        }
        void LoadData()
        {
            data.Add(new KeyAndValue { Key = "One", Value = 1 });
            data.Add(new KeyAndValue { Key = "Two", Value = 2 });
            data.Add(new KeyAndValue { Key = "Three", Value = 3 });
            data.Add(new KeyAndValue { Key = "Four", Value = 4 });
            data.Add(new KeyAndValue { Key = "Five", Value = 5 });
            data.Add(new KeyAndValue { Key = "Six", Value = 6 });
            data.Add(new KeyAndValue { Key = "Seven", Value = 7 });
            data.Add(new KeyAndValue { Key = "Eight", Value = 8 });
            data.Add(new KeyAndValue { Key = "Nine", Value = 9 });
            data.Add(new KeyAndValue { Key = "Ten", Value = 10 });
            data.Add(new KeyAndValue { Key = "Eleven", Value = 11 });
            data.Add(new KeyAndValue { Key = "Twelve", Value = 12 });
            data.Add(new KeyAndValue { Key = "Thirteen", Value = 13 });
            data.Add(new KeyAndValue { Key = "Fourteen", Value = 14 });
            data.Add(new KeyAndValue { Key = "Fifteen", Value = 15 });
            data.Add(new KeyAndValue { Key = "Sixteen", Value = 16 });
            data.Add(new KeyAndValue { Key = "Seventeen", Value = 17 });
            data.Add(new KeyAndValue { Key = "Eighteen", Value = 18 });
            data.Add(new KeyAndValue { Key = "Nineteen", Value = 19 });
            data.Add(new KeyAndValue { Key = "Twenty", Value = 20 });
            data.Add(new KeyAndValue { Key = "Twenty-One", Value = 21 });
            data.Add(new KeyAndValue { Key = "Twenty-Two", Value = 22 });
            data.Add(new KeyAndValue { Key = "Twenty-Three", Value = 23 });
            data.Add(new KeyAndValue { Key = "Twenty-Four", Value = 24 });
            data.Add(new KeyAndValue { Key = "Twenty-Five", Value = 25 });
            data.Add(new KeyAndValue { Key = "Twenty-Six", Value = 26 });
            data.Add(new KeyAndValue { Key = "Twenty-Seven", Value = 27 });
            data.Add(new KeyAndValue { Key = "Twenty-Eight", Value = 28 });
            data.Add(new KeyAndValue { Key = "Twenty-Nine", Value = 29 });
            data.Add(new KeyAndValue { Key = "Thirty", Value = 30 });
        }
        void SetLayout(WebCombo combo)
        {
            combo.AllowAutoPostback = true;
            combo.LayoutSettings.ResultBoxWindowType = ISNet.WebUI.DisplayType.Popup;  // LayoutEventArgs issues seem to be fewer when set to Normal.  However, need popup to work.
            combo.LayoutSettings.ComboMode = Mode.MultipleColumns;
            combo.LayoutSettings.StatusBoxPosition = BoxPosition.Top;
            combo.LayoutSettings.ResultBoxHeight = 360;
            combo.LayoutSettings.AllowFloatingText = false;
            //combo.UseDefaultStyle = true;  // Uncommenting helps
            //combo.LayoutSettings.AllowDefaultStyleMerging = false;
            combo.LayoutSettings.ColumnWidthDefault = Unit.Pixel(50);
            combo.LayoutSettings.MoreButtonStyle.Normal.CssClass = "comboMoreMini";
            combo.LayoutSettings.MoreButtonStyle.Over.CssClass = "comboMoreOverMini";
            combo.LayoutSettings.FrameStyle.Normal.CssClass = "comboFrameMini";
            combo.LayoutSettings.FrameStyle.Active.CssClass = "comboFrameMini";
            combo.LayoutSettings.FrameStyle.Over.CssClass = "comboFrameOverMini";
            combo.LayoutSettings.TextBoxStyle.Normal.CssClass = "comboTextBoxMini";
            combo.LayoutSettings.TextBoxStyle.Active.CssClass = "comboTextBoxMini";
            combo.LayoutSettings.TextBoxStyle.Over.CssClass = "comboTextBoxOverMini";
            combo.LayoutSettings.ResultBoxStyle.CssClass = "comboResultBoxMini";
            combo.LayoutSettings.RowStyle.Normal.CssClass = "comboRowMini";
            combo.LayoutSettings.RowStyle.Over.CssClass = "comboRowOverMini";
            combo.LayoutSettings.HeaderStyle.CssClass = "comboHeaderMini";
            combo.LayoutSettings.StatusBoxStyle.CssClass = "comboStatusBoxMini";
            combo.LayoutSettings.SelectedRowStyle.CssClass = "comboSelectedRowMini";
            combo.LayoutSettings.ResultFrameStyle.CssClass = "comboResultFrameMini";
            combo.LayoutSettings.ColumnStyle.CssClass = "comboColumnMini";
        }
        void combo_InitializeDataSource(object sender, DataSourceEventArgs e)
        {
            WebCombo combo = (WebCombo)sender;
            e.DataSource = data;
        }
        void combo_InitializeLayout(object sender, LayoutEventArgs e)
        {
            WebCombo combo = (WebCombo)sender;
            combo.DataTextField = "Key";
            combo.DataValueField = "Value";
        }
    }
}

Container.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Container.aspx.cs" Inherits="WebComboTest.Container" %>
<!DOCTYPE HTML PUBLIC ""-//W3C//DTD HTML 4.0 Transitional//EN"">
<html>
<head id="Head1" runat="server">
    <link rel="stylesheet" type="text/css" href="Styles.css">
</head>
<body>
    <form id="form1" runat="server">
        <iframe width="251" height="21" scrolling="no" src="Default.aspx"></iframe>
    </form>
</body>
</html>

Container.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace WebComboTest
{
    public class Container : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
        }
    }
}

Hello,

Thank you for the sample.

I try to make a sample based on your code. I make a couple of changes from your code.
In Default.cs file, from: “ISNet.WebUI.DisplayType.Normal;” to “ISNet.WebUI.DisplayType.PopUp;”.
In Style.css file, in “.comboRowOverMini” section, I modify the background color to “Red”.
And it works fine on my end.

I provide the sample and video about the result that I get on my local end.
Please kindly have review on the sample & video and please let me know your response.

Or you could download the video from this link: http://sdrv.ms/17Sxpyl

Regards,

Hans.

Thanks for giving this a try.  I cannot access your video from the attached file and it does not appear to be on the SKyDrive page.  So, I cannot see what you saw.

I took your code and see that the red works on the selected row.  When the line setting UseDefaultStyle is commented out, I can get that to work also.  However, I cannot style other things such as the row height and the column borders.  Please uncomment the line setting UseDefaultStyle = true and then try it.  Doing this will show the results area with those styles working.  Also, with the line commented out, as I move my mouse over the rows, the row height appears to change.  So, I don't think the styles are working properly. 

I uploaded a file to your SkyDrive folder, linked in your post, named WebComboCompare.gif.  The image on the left shows the WebCombo, generated from your code, with the UseDefaultStyle line commented out.  The image on the right shows the WebCombo after uncommenting the UseDefaultSyle line.  Nothing else was change in the code or CSS file.  

Also, I had another question in the prior posts.  In my existing application using WebCombo 2, when I use the down arrow to move through the results and reach the bottom, more data is retrieved automatically.  In this example, the cursor wraps back to the top and I must click the more button to get more data. How can I enable this feature in WebCombo 6 so that data is automatically loaded when reaching the end of the current data?

Thanks

Hello,

Thank you for the reply and I am sorry for the late response.

I have re-uploaded the video to the SkyDrive.

Regarding the “Styling” issue, in WebCombo Samples Solution, there are a couple of WebCombo sample that using customize style (for example: Style_GreenGrass.aspx; Style_XPBlue.aspx; etc.) and it works fine.
Please kindly have review on those samples.
In my humble opinion, please kindly try WebCombo 6 in the latest IE browser version, due to basically WebCombo 6 not designed for older IE browser version.

Regarding “LoadOnDemand” feature, that is default behavior in WebCombo 6. You should click on “down arrow” to load more data.

Thank you.

Regards,

Hans.