CheckboxGroup and RadioGroup display issue

  1. #1

    CheckboxGroup and RadioGroup display issue

    Hi
    my page show
    Click image for larger version. 

Name:	360截图20120103163022353.jpg 
Views:	171 
Size:	22.7 KB 
ID:	3648
    when click fieldLabel,page display result
    Click image for larger version. 

Name:	360截图20120103162327634.jpg 
Views:	198 
Size:	27.1 KB 
ID:	3647
    why?please help me!
    sorry,my english is so bad.
  2. #2
    Hi,

    Please provide a sample to reproduce.
  3. #3
    Hi, Thanks For Your Reply
    my code:

    <ext:FormPanel ID="Panel1" runat="server" Title="Simple Form"
            Width="550" ButtonAlign="Center" LabelWidth="150" Padding="15" TrackLabels="False">
            <Items>
                <ext:TextField ID="TextField5" DataIndex="AA" runat="server" FieldLabel="First Name"
                    AllowBlank="false" AnchorHorizontal="100%" />
                <ext:TextField ID="TextField6" DataIndex="BB" runat="server" FieldLabel="Last Name"
                    AnchorHorizontal="100%" />
                <ext:TextField ID="TextField7" DataIndex="CC" runat="server" FieldLabel="Company"
                    AnchorHorizontal="100%" />
                <ext:TextField ID="TextField8" DataIndex="DD" runat="server" FieldLabel="Email" Vtype="email"
                    AnchorHorizontal="100%" />
                <ext:ComboBox ID="D_Type" runat="server" DataIndex="D_Type" FieldLabel="组件类型" Editable="False">
                    <Items>
                        <ext:ListItem Text="单行文本" Value="TextField" />
                        <ext:ListItem Text="日期文本" Value="DateField" />
                        <ext:ListItem Text="数字文本" Value="NumberField" />
                        <ext:ListItem Text="多行文本" Value="TextArea" />
                        <ext:ListItem Text="下拉列表" Value="ComboBox" />
                        <ext:ListItem Text="单选列表" Value="RadioGroup" />
                        <ext:ListItem Text="多选列表" Value="CheckboxGroup" />
                    </Items>
                    <SelectedItem Text="单行文本" Value="TextField" />
                </ext:ComboBox>
                <ext:CheckboxGroup ID="CheckboxGroup4" runat="server" DataIndex="EEE" FieldLabel="Multi-Column<br/>(Vertical)"
                    ColumnsNumber="3">
                    <Items>
                        <ext:Checkbox ID="TT1" runat="server" BoxLabel="Item 1" Checked="true" />
                        <ext:Checkbox ID="TT2" runat="server" BoxLabel="Item 2" Checked="true" />
                        <ext:Checkbox ID="TT3" runat="server" BoxLabel="Item 3" />
                        <ext:Checkbox ID="TT4" runat="server" BoxLabel="Item 4" Checked="true" />
                        <ext:Checkbox ID="TT5" runat="server" BoxLabel="Item 5" />
                    </Items>
                </ext:CheckboxGroup>
                <ext:RadioGroup ID="RadioGroup2" runat="server" DataIndex="FFF" FieldLabel="Single Column" ColumnsNumber="3"
                    ItemCls="x-check-group-alt">
                    <Items>
                        <ext:Radio ID="Radio1" runat="server" BoxLabel="Item 1" />
                        <ext:Radio ID="Radio2" runat="server" BoxLabel="Item 2" Checked="true" />
                        <ext:Radio ID="Radio3" runat="server" BoxLabel="Item " />
                    </Items>
                </ext:RadioGroup>
            </Items>
            <Buttons>
                <ext:Button runat="server" Text="Save">
                    <Listeners>
                        <Click Handler="Ext.Msg.alert('Status', Ext.encode(getFieldValues(#{Panel1}.getForm(), false, 'dataIndex')));" />
                    </Listeners>
                </ext:Button>
                <ext:Button runat="server" Text="Cancel" />
            </Buttons>
        </ext:FormPanel>
    Last edited by Daniil; Jan 03, 2012 at 7:54 AM. Reason: Please use [CODE] tags
  4. #4
    Thanks.

    What browser do you test with? IE7?
  5. #5
    360安全浏览器

    The development of Chinese web browser, http://se.360.cn/
  6. #6
    Well, this browser is not officially supported.

    Though I've reproduced the problem under IE7. Probably, a fix will work in both browsers.

    Anyways, we should find a fix first.

    Here is the example to reproduce the problem.

    Example
    <%@ Page Language="C#" %>
     
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" 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>Ext.NET Example</title>
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server" />
            <ext:FormPanel runat="server" Width="500">
                <Items>
                    <ext:CheckboxGroup runat="server" FieldLabel="Checkboxes" ColumnsNumber="3">
                        <Items>
                            <ext:Checkbox runat="server" BoxLabel="Item 1" />
                            <ext:Checkbox runat="server" BoxLabel="Item 2" />
                            <ext:Checkbox runat="server" BoxLabel="Item 3" />
                        </Items>
                    </ext:CheckboxGroup>
                    <ext:RadioGroup runat="server" FieldLabel="Radios" ColumnsNumber="3" >
                        <Items>
                            <ext:Radio runat="server" BoxLabel="Item 1" />
                            <ext:Radio runat="server" BoxLabel="Item 2" />
                            <ext:Radio runat="server" BoxLabel="Item 3" />
                        </Items>
                    </ext:RadioGroup>
                </Items>
            </ext:FormPanel>
        </form>
    </body>
    </html>
    Last edited by Daniil; Jan 03, 2012 at 11:23 AM.
  7. #7
    IE9 no problem.

    but ,How to remove borders of CheckboxGroup and RadioGroup ,
  8. #8
    Thank you very much!
    This problem is not important, but I think it is not beautiful
  9. #9
    I've found a workaround to fix it.

    Please set up the following Focus listener for CheckboxGroup and RadioGroup.
    <Focus Handler="this.blur();" />
    Example
    <%@ Page Language="C#" %>
     
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" 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>Ext.NET Example</title>
    </head>
    <body>
        <form runat="server">
            <ext:ResourceManager runat="server" />
            <ext:FormPanel runat="server" Width="500">
                <Items>
                    <ext:CheckboxGroup runat="server" FieldLabel="Checkboxes" ColumnsNumber="3">
                        <Items>
                            <ext:Checkbox runat="server" BoxLabel="Item 1" />
                            <ext:Checkbox runat="server" BoxLabel="Item 2" />
                            <ext:Checkbox runat="server" BoxLabel="Item 3" />
                        </Items>
                        <Listeners>
                            <Focus Handler="this.blur();" />
                        </Listeners>
                    </ext:CheckboxGroup>
                    <ext:RadioGroup runat="server" FieldLabel="Radios" ColumnsNumber="3" >
                        <Items>
                            <ext:Radio runat="server" BoxLabel="Item 1" />
                            <ext:Radio runat="server" BoxLabel="Item 2" />
                            <ext:Radio runat="server" BoxLabel="Item 3" />
                        </Items>
                        <Listeners>
                            <Focus Handler="this.blur();" />
                        </Listeners>
                    </ext:RadioGroup>
                </Items>
            </ext:FormPanel>
        </form>
    </body>
    </html>
  10. #10
    The problem solved, thank you for your help!

Similar Threads

  1. RadioGroup display different in IE9 and Chrome
    By easypower in forum 1.x Help
    Replies: 6
    Last Post: Mar 26, 2012, 1:30 PM
  2. Replies: 9
    Last Post: Jun 15, 2011, 7:01 AM
  3. [CLOSED] CheckboxGroup, RadioGroup & IE6
    By Justin_Wignall in forum 1.x Legacy Premium Help
    Replies: 5
    Last Post: Apr 26, 2011, 1:08 PM
  4. Replies: 0
    Last Post: Oct 28, 2009, 6:05 AM
  5. [CLOSED] CheckBoxGroup - RadioGroup validate()
    By methode in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Jan 26, 2009, 5:33 AM

Tags for this Thread

Posting Permissions