自定義Ext.Net TreeGrid節點？

我要用自定義節點創建一個Ext.Net的TreeGrid。
例如：
所有TreeGrid的節點都應該在它自己的前面有一個文本框，並且用戶應該在其上寫一個數字。
見下面的圖片：
自定義Ext.Net TreeGrid節點？

Custom Ext.Net TreeGrid

另外，我在回發的代碼來獲得每個節點的文本框的值後面。

請問您能指導我，我如何使用Ext.net和C＃創建它？
謝謝。

2011-11-20 Mohammad Dayyan

你試圖設置網格編輯？ – Baidaly

其實，我想要有可見的文本框，而不是雙擊來顯示它。 –

你能幫我一把嗎？ http://stackoverflow.com/questions/9058921/configuration-required-to-get-sencha-extjs-treegrid-example-working – MacGyver

我找到了答案：

<ext:TreeGrid ID="KnowledgeFieldsTreeGridWithTextBox1" runat="server" Title="Fileds " 
    Icon="Plugin" Height="300" AutoHeight="true" AutoExpandColumn="KnowledgeFiled"> 
    <TopBar> 
     <ext:Toolbar ID="KnowledgeFieldsTreeGridWithTextBoxToolbar1" runat="server"> 
      <Items> 
       <ext:ToolbarFill ID="KnowledgeFieldsTreeGridWithTextBoxToolbarFill1" runat="server" /> 
       <ext:ToolbarTextItem ID="KnowledgeFieldsTreeGridWithTextBoxTextItem1" runat="server" 
        Text=" Filter : " /> 
       <ext:TriggerField ID="KnowledgeFieldsTreeGridWithTextBox_TriggerField1" runat="server" EnableKeyEvents="true"> 
        <Triggers> 
         <ext:FieldTrigger Icon="Clear" /> 
        </Triggers> 
        <Listeners> 
         <KeyUp Fn="KnowledgeFieldsTreeGridWithTextBox_KeyUp" Buffer="250" /> 
         <TriggerClick Fn="KnowledgeFieldsTreeGridWithTextBox_ClearFilter" /> 
        </Listeners> 
       </ext:TriggerField> 
      </Items> 
     </ext:Toolbar> 
    </TopBar> 
    <Columns> 
     <ext:TreeGridColumn Header="Filed Name" DataIndex="KnowledgeFiledName" Width="100" Align="Center" /> 
     <ext:TreeGridColumn Header="Score" DataIndex="KnowledgeScore" Width="200" Align="Right"> 
      <XTemplate runat="server"> 
       <Html> 
        <tpl if="values.leaf"> 
         <input type="text" style="width:30px; text-align:left;" maxlength="5" value="{KnowledgeFiledScore}"></input> 
        </tpl> 
       </Html> 
      </XTemplate> 
     </ext:TreeGridColumn> 
    </Columns> 
    <Root> 

    </Root> 
    <Listeners> 
     <BeforeClick Handler="return !Ext.fly(e.getTarget()).is('input[type=text]');" /> 
    </Listeners> 
</ext:TreeGrid>

來源

2011-12-07 05:58:59

不幸的是，在Ext.NET（v1.x）中使用當前版本<ext:TreeGrid>來實現這些功能令人煩惱。 <ext:TreeGrid>只是沒有爲這種類型的渲染設置。

在下一個Ext.NET發行版（v2）中有幫助，儘管此時它尚未發佈。

下面是一個基本示例，幫助您開始渲染<input>字段。

例

<%@ 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>TreeGrid - Ext.NET Examples</title> 

    <link href="../../../../resources/css/examples.css" rel="stylesheet" type="text/css" /> 

    <script type="text/javascript"> 
     var formatHours = function (v) { 
      if (v || v === 0) { 
       return "Number : <input class=\"x-form-text x-form-field\" type=\"text\" value=\"" + v + "\" />"; 
      } 
      return ""; 
     }; 
    </script> 
</head> 
<body> 
    <form runat="server"> 
     <ext:ResourceManager runat="server" /> 

     <ext:TreeGrid 
      ID="TreeGrid1" 
      runat="server" 
      Title="Projects" 
      Width="500" 
      Height="300" 
      NoLeafIcon="true" 
      EnableDD="true"> 
      <Columns> 
       <ext:TreeGridColumn Header="Task" Width="230" DataIndex="task" /> 
       <ext:TreeGridColumn Header="Score" Width="200" DataIndex="duration" Align="Center" SortType="AsFloat"> 
        <XTemplate runat="server"> 
         <Html> 
          {duration:this.formatHours} 
         </Html> 
         <Functions> 
          <ext:JFunction Name="formatHours" Fn="formatHours" /> 
         </Functions> 
        </XTemplate> 
       </ext:TreeGridColumn> 
      </Columns> 
      <Root> 
       <ext:TreeNode Text="Tasks"> 
        <Nodes> 
         <ext:TreeNode Icon="Folder" Expanded="true"> 
          <CustomAttributes> 
           <ext:ConfigItem Name="task" Value="Project: Shopping" Mode="Value" /> 
          </CustomAttributes> 
          <Nodes> 
           <ext:TreeNode Icon="Folder" Expanded="true"> 
            <CustomAttributes> 
             <ext:ConfigItem Name="task" Value="Remodeling" Mode="Value" /> 
            </CustomAttributes> 
            <Nodes> 
             <ext:TreeNode Icon="Folder"> 
              <CustomAttributes> 
               <ext:ConfigItem Name="task" Value="Paint bedroom" Mode="Value" /> 
              </CustomAttributes> 
              <Nodes> 
               <ext:TreeNode Leaf="true"> 
                <CustomAttributes> 
                 <ext:ConfigItem Name="task" Value="Ceiling" Mode="Value" /> 
                 <ext:ConfigItem Name="duration" Value="1.25" /> 
                </CustomAttributes> 
               </ext:TreeNode> 
               <ext:TreeNode Leaf="true"> 
                <CustomAttributes> 
                 <ext:ConfigItem Name="task" Value="Walls" Mode="Value" /> 
                 <ext:ConfigItem Name="duration" Value="1.5" /> 
                </CustomAttributes> 
               </ext:TreeNode> 
              </Nodes> 
             </ext:TreeNode> 
             <ext:TreeNode Leaf="true"> 
              <CustomAttributes> 
               <ext:ConfigItem Name="task" Value="Decorate living room" Mode="Value" /> 
               <ext:ConfigItem Name="duration" Value="12" /> 
              </CustomAttributes> 
             </ext:TreeNode> 
             <ext:TreeNode Leaf="true"> 
              <CustomAttributes> 
               <ext:ConfigItem Name="task" Value="Fix lights" Mode="Value" /> 
               <ext:ConfigItem Name="duration" Value="0" /> 
              </CustomAttributes> 
             </ext:TreeNode> 
             <ext:TreeNode Leaf="true"> 
              <CustomAttributes> 
               <ext:ConfigItem Name="task" Value="Reattach screen door" Mode="Value" /> 
               <ext:ConfigItem Name="duration" Value="142" /> 
              </CustomAttributes> 
             </ext:TreeNode> 
             <ext:TreeNode Leaf="true"> 
              <CustomAttributes> 
               <ext:ConfigItem Name="task" Value="Retile kitchen" Mode="Value" /> 
               <ext:ConfigItem Name="duration" Value="96" /> 
              </CustomAttributes> 
             </ext:TreeNode> 
            </Nodes> 
           </ext:TreeNode> 
          </Nodes> 
         </ext:TreeNode> 
        </Nodes> 
       </ext:TreeNode> 
      </Root> 
     </ext:TreeGrid>   
    </form> 
</body> 
</html>

來源

2011-11-21 07:37:00

我已經測試過它。我們無法專注於treegrid中的文本框 –

自定義Ext.Net TreeGrid節點？

回答

相關問題