动态创建的树视图格式答案

【问题标题】：Dynamically created treeview format动态创建的树视图格式
【发布时间】：2015-09-12 02:26:07
【问题描述】：

编辑

已通过将 width: 100% 添加到 css 来修复它。

我有一个动态创建的树视图，它将位置作为父节点并在子节点中的这些位置列出交易。树视图是动态创建的，所以我不能在它周围放置一个 div 并格式化 div。我试过了。 div 中的格式根本不显示。我希望树视图显示如下：

_位置A

____ 交易 A

____ 交易 B

____ 交易 C

_位置B

____ 交易 A

____ 交易 B

____ 交易 C

但现在它显示居中并且看起来很丑。我尝试过使用 div，我尝试过使用类。节点拒绝左对齐并牢牢地保持在中心。我知道该类正在工作，因为我可以更改边距、边框和背景颜色，但没有任何内容触及实际文本。

aspx:

<asp:MultiView ID="LoginView" runat="server">
    <asp:View ID="VendorContent" runat="server">
            <h2>My Locations</h2>
            <hr style="margin-left: 10%; margin-right: 10%">
            <br />
            <div class="location" runat="server">
                <div id="treeview" runat="server">
                    <asp:TreeView ID="LocationTreeView" runat="server" Value="Left" CssClass="treeview">
                    </asp:TreeView>
                    <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
                </div>
                <asp:Button runat="server" ID="saveChanges" OnClick="saveChanges_Click" Text="Save Changes" CssClass="save_treeview"/>
                <a id="newDealLink" href="deals.aspx">Make a new deal</a>
            </div>
        </asp:View>
</asp:MultiView>

aspx.cs:

This is called in the page load if the view is a vendor:

private void loadVendorTree(UserInfo userinfo)
{
    LocationTreeView.ShowCheckBoxes = TreeNodeTypes.All;

    foreach (Location location in locations)
    {
        List<int> deal_IDs = new List<int>();
        TreeNode node = new TreeNode(location.Address, location.Location_id.ToString());
        node.ShowCheckBox = false;
        foreach (Deal deal in deals)
        {
            TreeNode dealNode = new TreeNode(deal.Info, deal.Deal_id.ToString());
            if(location.Deals.Contains(deal)){
                dealNode.Checked = true;
            }
            else
            {
                dealNode.Checked = false;
            }
            deal_IDs.Add(deal.Deal_id);
            dealNode.SelectAction = TreeNodeSelectAction.Select;
            node.ChildNodes.Add(dealNode);
        }
        LocationTreeView.Nodes.Add(node);
    }
}

css：

.treeview {
text-align: left;
margin: .5em 0;
padding-left: 0;
padding-right: 6em;
color: black;
border: 2px solid pink;
}

.save_treeview {
margin-left: .5em;
margin-bottom: .5em;
width: 10em;
}

.location {
text-align: left;
max-width: 45em;
margin: 0 auto;
background: rgba(255,255,255,0.5);
border: 2px solid #dcdaf1;
}

如果有人可以帮助我或指导我做某事，我将不胜感激。

【问题讨论】：

标签： c# css asp.net treeview

【解决方案1】：

也许可以试试这样的嵌套无序列表：

<ul>
    <li>Location A</li>
    <li>
         <ul>
              <li>Deal A</li>
              <li>Deal B</li>
              <li>Deal C</li>
         </ul>
    </li>
    <li>Location B</li>
    <li>
         <ul>
              <li>Deal A</li>
              <li>Deal B</li>
              <li>Deal C</li>
         </ul>
    </li>    
 </ul>

然后只需使用 css 设置无序列表和列表项的样式就可以了。

【讨论】：