效果图:

Coolite 布局ColumnLayout用法

Html代码:

<ext:Panel ID="Panel6" runat="server" >
          <Body>
                <ext:ColumnLayout ID="ColumnLayout3" runat="server">
                      <ext:LayoutColumn >
                          <ext:Panel ID="Panel1" runat="server" Border="false" Header="false" BodyStyle="padding:2px 0px 0px 9px;">
                                 <Body>
                                    <ext:FormLayout ID="FormLayout8" runat="server"  LabelWidth ="60">
                                         <ext:Anchor>
                                              <ext:TextField ID="txtCustomerName" runat="server"  MaxLength="20" 
                                                      FieldLabel="姓名" Width="120" TabIndex="6"  ReadOnly="true" ></ext:TextField> 
                                         </ext:Anchor>
                                         <ext:Anchor>
                                               <ext:TextField ID="txtCustomerType" runat="server"  MaxLength="20" 
                                                      FieldLabel="客户类型" Width="120" TabIndex="6"  ReadOnly="true"></ext:TextField> 
                                               </ext:Anchor>    
                                          <ext:Anchor >
                                                 <ext:TextField ID="txtServerAddress" runat="server" 

                      FieldLabel="服务站" Width="120" TabIndex="9"  ReadOnly="true"></ext:TextField> 
                                           </ext:Anchor>
                                    </ext:FormLayout>
                                  </Body> 
                            </ext:Panel> 
                       </ext:LayoutColumn> 
                       <ext:LayoutColumn >
                             <ext:Panel ID="Panel7" runat="server" Border="false" Header="false" BodyStyle="padding:2px 0px 0px 9px;">
                                 <Body>
                                     <ext:FormLayout ID="FormLayout5" runat="server"  LabelWidth ="60">
                                           <ext:Anchor>
                                                <ext:TextField ID="txtTelePhone" runat="server" 

                      FieldLabel="电话" Width="120" TabIndex="7" ReadOnly="true"> </ext:TextField> 
                                           </ext:Anchor>
                                           <ext:Anchor>
                                                <ext:TextField ID="txtMobil" runat="server" 

                      FieldLabel="手机" Width="120" TabIndex="8" ReadOnly="true"> </ext:TextField> 
                                            </ext:Anchor>
                                            <ext:Anchor>
                                                  <ext:TextField ID="txtCustomerState" runat="server"  

                      FieldLabel="用户状态" Width="120" TabIndex="7" ReadOnly="true"> </ext:TextField> 
                                             </ext:Anchor>
                                          </ext:FormLayout>
                                       </Body> 
                                   </ext:Panel> 
                                   </ext:LayoutColumn> 
                                   <ext:LayoutColumn >
                                        <ext:Panel ID="Panel8" runat="server" Border="false" Header="false" BodyStyle="padding:2px 0px 0px 9px;">
                                             <Body>
                                                 <ext:FormLayout ID="FormLayout6" runat="server"  LabelWidth ="60">
                                                    <ext:Anchor>
                                                        <ext:TextField ID="txtApplyDate" runat="server"  

                         FieldLabel="报装日期" Width="120" TabIndex="7" ReadOnly="true">  </ext:TextField> 
                                                    </ext:Anchor>
                                                    <ext:Anchor>
                                                         <ext:TextField ID="txtStopDate" runat="server"

                        FieldLabel="停机日期" Width="120" TabIndex="8"  ReadOnly="true">  </ext:TextField> 
                                                     </ext:Anchor>
                                                     <ext:Anchor >
                                                          <ext:TextField ID="txtBalance" runat="server"

                        FieldLabel="余额" Width="120" TabIndex="9"  ReadOnly="true"></ext:TextField> 
                                                     </ext:Anchor>
                                             </ext:FormLayout>
                                              </Body> 
                                          </ext:Panel> 
                                   </ext:LayoutColumn>

    </Body>

</ext:Panel>

相关文章:

  • 2021-10-17
  • 2022-12-23
  • 2022-12-23
  • 2021-07-12
  • 2022-12-23
  • 2022-01-06
  • 2022-12-23
  • 2021-06-05
猜你喜欢
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2021-07-09
  • 2021-06-24
  • 2022-12-23
  • 2021-09-11
相关资源
相似解决方案