2013-04-01 17 views
0

我想創建2個不同的列,並在每個列中我想要有多個項目。例如ComboBox和一個列中的2個DateFields。在Ext.net的LayoutColumn中添加多個項目

我發佈的代碼,它給了我和錯誤,當我嘗試運行它說:「只有一個組件允許在這集」

<body> 
<form id="MetricsForm" runat="server"> 
<ext:ResourceManager ID="MetricsManager" runat="server" /> 
    <ext:Viewport ID="MetricsViewPort" runat="server"></ext:Viewport> 
    <asp:SqlDataSource ID="DMSSQL2DataSource" runat="server" ConnectionString="" /> 
    <asp:SqlDataSource ID="LocalDataSource" runat="server" ConnectionString="" /> 
    <ext:TabPanel ID="TabPanel" runat="server"> 
     <Items> 
      <ext:Panel runat="server" Title="Step 1" ID="Tab1"> 
       <Items> 
        <ext:Panel ID="Panel1" 
         runat="server" 
         Title="Step 1: Choose date span and set spans" 
         Region="North" 
         Height="200" 
         Width="475" 
         MinWidth="225" 
         MaxWidth="475"> 

         <Items> 
          <ext:Container runat="server" Layout="RowLayout" Height="200" > 
           <Items> 
            <ext:ColumnLayout runat="server" ID="MetricsColumnLayout"> 
             <Columns> 
              <ext:LayoutColumn ColumnWidth="0.5"> 
               <ext:RadioGroup runat="server" ID="ChooseSpan" Selectable="true" ColumnsNumber="1" > 
                <Items> 
                 <ext:Radio ID="RadioAll" runat="server" BoxLabel="Show All" InputValue="0" /> 
                 <ext:Radio ID="RadioMonth" runat="server" BoxLabel="Choose Date Range(By Month)" InputValue="1" /> 
                 <ext:Radio ID="RadioDate" runat="server" BoxLabel="Choose Date Range(By Dates)" InputValue="2" /> 
                </Items> 
               </ext:RadioGroup> 
              </ext:LayoutColumn> 
              <ext:LayoutColumn ColumnWidth="0.5"> 
               <ext:ComboBox runat="server" ID="MonthComboBox" Selectable="true" SelectedIndex="0" StyleSpec="margin-bottom:4px;" Width="200" > 
                <Items> 
                 <ext:ListItem Text="Any Month" Value="0" /> 
                 <ext:ListItem Text="January" Value="1" /> 
                 <ext:ListItem Text="February" Value="2" /> 
                 <ext:ListItem Text="March" Value="3" /> 
                 <ext:ListItem Text="April" Value="4" /> 
                 <ext:ListItem Text="May" Value="5" /> 
                 <ext:ListItem Text="June" Value="6" /> 
                 <ext:ListItem Text="July" Value="7" /> 
                 <ext:ListItem Text="August" Value="8" /> 
                 <ext:ListItem Text="September" Value="9" /> 
                 <ext:ListItem Text="October" Value="10" /> 
                 <ext:ListItem Text="November" Value="11" /> 
                 <ext:ListItem Text="December" Value="12" /> 
                </Items> 
               </ext:ComboBox> 
               <ext:DateField 
                ID="StartDateField" 
                runat="server" 
                FieldLabel="Start" 
                Vtype="daterange" 
                AnchorHorizontal="100%" 
                EnableKeyEvents="true" 
                Width="200"> 
                <CustomConfig> 
                 <ext:ConfigItem Name="endDateField" Value="#{EndDateField}" Mode="Value" /> 
                </CustomConfig> 
                <Listeners> 
                </Listeners> 
               </ext:DateField> 

               <ext:DateField 
                ID="EndDateField" 
                runat="server" 
                Vtype="daterange" 
                FieldLabel="End" 
                AnchorHorizontal="100%" 
                EnableKeyEvents="true" 
                Width="200"> 
                <CustomConfig> 
                 <ext:ConfigItem Name="startDateField" Value="#{StartDateField}" Mode="Value" /> 
                </CustomConfig> 
                <Listeners> 
                </Listeners> 
               </ext:DateField> 
              </ext:LayoutColumn> 
             </Columns> 
            </ext:ColumnLayout> 
           </Items> 
          </ext:Container> 
         </Items> 
        </ext:Panel> 
       </Items> 

      </ext:Panel> 
      <ext:Panel runat="server" Title="Step 2" ID="Tab2"> 

      </ext:Panel> 
     </Items> 
    </ext:TabPanel> 
<div> 

</div> 
</form> 

+1

您是否正在使用'母版頁'?如果不是你不能使用'

'some content...
'some content...
' – MethodMan

回答

0

只是包裝在一個容器中的東西。

<ext:Container 
    runat="server" 
    Width="600" 
    Height="300" 
    Layout="ColumnLayout"> 
    <Items> 
     <ext:RadioGroup runat="server" ColumnWidth="0.5"> 
      <Items> 
       <ext:Radio runat="server" BoxLabel="1" /> 
       <ext:Radio runat="server" BoxLabel="2" /> 
      </Items> 
     </ext:RadioGroup> 
     <ext:Container runat="server" ColumnWidth="0.5"> 
      <Items> 
       <ext:ComboBox runat="server" /> 
       <ext:DateField runat="server" /> 
       <ext:DateField runat="server" /> 
      </Items> 
     </ext:Container> 
    </Items> 
</ext:Container> 
+0

正是我所需要的。現在我完全理解容器如何工作!非常感謝 – webminer07

1

我不是100%確定您嘗試配置什麼佈局,但最好避免使用佈局控件,因爲它們已從Ext.NET 2中刪除。您可以使用.Layout屬性。

以下示例演示如何用.Layout屬性替換Layout控件。

<%@ Page Language="C#" %> 

<!DOCTYPE html> 

<html> 
<head runat="server"> 
    <title>Ext.NET Example</title> 
</head> 
<body> 
    <form runat="server"> 
     <ext:ResourceManager runat="server" /> 

     <ext:TabPanel runat="server"> 
      <Items> 
       <ext:Panel runat="server" Title="Step 1"> 
        <Items> 
         <ext:Panel 
          runat="server" 
          Title="Step 1: Choose date span and set spans" 
          Region="North" 
          Height="200" 
          Width="475" 
          MinWidth="225" 
          MaxWidth="475"> 
          <Items> 
           <ext:Container runat="server" Layout="ColumnLayout" Height="200"> 
            <Items> 
             <ext:RadioGroup runat="server" Selectable="true" ColumnsNumber="1" > 
              <Items> 
               <ext:Radio runat="server" BoxLabel="Show All" InputValue="0" /> 
               <ext:Radio runat="server" BoxLabel="Choose Date Range(By Month)" InputValue="1" /> 
               <ext:Radio runat="server" BoxLabel="Choose Date Range(By Dates)" InputValue="2" /> 
              </Items> 
             </ext:RadioGroup> 
             <ext:ComboBox 
              runat="server" 
              Selectable="true" 
              SelectedIndex="0" 
              StyleSpec="margin-bottom:4px;" 
              Width="200"> 
              <Items> 
               <ext:ListItem Text="Any Month" Value="0" /> 
               <ext:ListItem Text="January" Value="1" /> 
               <ext:ListItem Text="February" Value="2" /> 
               <ext:ListItem Text="March" Value="3" /> 
               <ext:ListItem Text="April" Value="4" /> 
               <ext:ListItem Text="May" Value="5" /> 
               <ext:ListItem Text="June" Value="6" /> 
               <ext:ListItem Text="July" Value="7" /> 
               <ext:ListItem Text="August" Value="8" /> 
               <ext:ListItem Text="September" Value="9" /> 
               <ext:ListItem Text="October" Value="10" /> 
               <ext:ListItem Text="November" Value="11" /> 
               <ext:ListItem Text="December" Value="12" /> 
              </Items> 
             </ext:ComboBox> 
             <ext:DateField 
              runat="server" 
              FieldLabel="Start" 
              AnchorHorizontal="100%" 
              EnableKeyEvents="true" 
              Width="200" 
              /> 
             <ext:DateField 
              runat="server" 
              FieldLabel="End" 
              AnchorHorizontal="100%" 
              EnableKeyEvents="true" 
              Width="200" 
              /> 
            </Items> 
           </ext:Container> 
          </Items> 
         </ext:Panel> 
        </Items> 

       </ext:Panel> 
       <ext:Panel runat="server" Title="Step 2"/> 
      </Items> 
     </ext:TabPanel> 
    </form> 
</body> 
</html> 
+0

完成相同的事情我想要實現的是第一列中的RadioGroup和第二列中的ComboBox和2 DateFields。這會實現嗎? – webminer07

相關問題