c# - 如何在另一个旁边显示动态创建的 DIV？

Question

我正在创建一个页面，该页面将在创建日志文件时在页面上动态显示它们。这是我的前端:

                <div id="container">
                <asp:UpdatePanel UpdateMode="Conditional" runat="server"     ID="ServerUpdates"> 
                    <Triggers>
                        <asp:AsyncPostBackTrigger ControlID="Timer" />
                    </Triggers>
                </asp:UpdatePanel>
            </div>
        </div>

这是我的CSS:

#container {
width:100%;
display: inline-block;
height:100%;
}

.textboxStatus
{
 /*background-image:url('http://placehold.it/15/15');*/
 background-repeat:no-repeat;
/* background-position:3px 3px;*/
 border:solid 1px black;
 padding:20px;
 width:600px;
 height:500px;
 float:left;
 clear:left;
 /*position:relative;*/
}
/*.textbox input
{
 border:none;
 background:transparent;
 width:100%;     
 outline: none;
}*/
.textboxURL
{
 /*background-image:url('http://placehold.it/15/15');*/
 background-repeat:no-repeat;
/* background-position:3px 3px;*/
 border:solid 1px black;
 padding:20px;
 width:575px;
 height:475px;
 float:right;
 /*clear: right;
 position:relative;*/
 display:inline;
}

下面是我的代码:

        protected void CreateDiv(object sender, EventArgs e)
    {
        string path = @"\\server\d$\websites\Updates\Product\Production\Logs";
        //int rowCount = 0;

        DirectoryInfo dir = new DirectoryInfo(path);
        List<FileInfo> FileList = dir.GetFiles().ToList();
        ServerUpdates.ContentTemplateContainer.Controls.Add(new LiteralControl("<asp:GridView runat='server' ID='Grid' AutoGenerateColumns='false'>"));
        ServerUpdates.ContentTemplateContainer.Controls.Add(new LiteralControl("<Columns>"));

        foreach (FileInfo file in FileList)
        {

            StreamReader sr = new StreamReader(new FileStream(file.FullName, FileMode.Open, FileAccess.Read, FileShare.ReadWrite));

            // string[] findStatus = System.IO.Directory.Exists(path, "codepush.log.*", System.IO.SearchOption.TopDirectoryOnly);
            // string[] findURL = System.IO.Directory.GetFiles(path, "sql.output.log.*", System.IO.SearchOption.TopDirectoryOnly);
            bool findStatus = (file.Name.Contains("codepush.log.")) ? true : false;//File.Exists(Path.Combine(path, ".txt"));
            bool findURL = (file.Name.Contains("sql.output.")) ? true : false;

            if (findStatus == true)
            {
                //ServerUpdates.ContentTemplateContainer.Controls.Add(new LiteralControl(String.Format("<br /><div class=\"statusLog\"><asp:TextBox runat=\"server\" id=\"tbStatus{0}\"/> </div><div class=\"urlLog\"></div>", count)));
                //(TextBox)ServerUpdates.ContentTemplateContainer.FindControl("tbStatus" + count.ToString());
                ServerUpdates.ContentTemplateContainer.Controls.Add(new LiteralControl(string.Format("<asp:BoundField Datafield={0} /><div class='textboxStatus'>", rowCount)));
                TextBox txt = new TextBox();
                txt.TextMode = TextBoxMode.MultiLine;
                txt.Wrap = false;
                txt.Width = 600;
                txt.Height = 500;

                while (!sr.EndOfStream)
                    txt.Text = txt.Text + sr.ReadLine() + "\r\n";
                //Panel txt = new Panel();
                //txt.ScrollBars = ScrollBars.Vertical;
                //txt.Wrap = true;
                ServerUpdates.ContentTemplateContainer.Controls.Add(txt);
                ServerUpdates.ContentTemplateContainer.Controls.Add(new LiteralControl("</div>"));
                ServerUpdates.ContentTemplateContainer.Controls.Add(new LiteralControl("</Columns>"));
            }

            if (findURL == true)
            {
                //ServerUpdates.ContentTemplateContainer.Controls.Add(new LiteralControl(String.Format("<br /><div class=\"statusLog\"><asp:TextBox runat=\"server\" id=\"tbStatus{0}\"/> </div><div class=\"urlLog\"></div>", count)));
                //(TextBox)ServerUpdates.ContentTemplateContainer.FindControl("tbStatus" + count.ToString());
                ServerUpdates.ContentTemplateContainer.Controls.Add(new LiteralControl("<Columns>"));
                ServerUpdates.ContentTemplateContainer.Controls.Add(new LiteralControl(string.Format("<asp:BoundField Datafield={0} /><div class='textboxURL'>", rowCount)));
                TextBox txt = new TextBox();
                txt.TextMode = TextBoxMode.MultiLine;
                txt.Wrap = false;
                txt.Width = 575;
                txt.Height = 475;

                while (!sr.EndOfStream)
                    txt.Text = txt.Text + sr.ReadLine() + "\r\n";
                //Panel txt = new Panel();
                //txt.ScrollBars = ScrollBars.Vertical;
                //txt.Wrap = true;
                ServerUpdates.ContentTemplateContainer.Controls.Add(txt);
                ServerUpdates.ContentTemplateContainer.Controls.Add(new LiteralControl("</div>"));
                ServerUpdates.ContentTemplateContainer.Controls.Add(new LiteralControl("</Columns>"));
           }
            //rowCount++;
        }
        ServerUpdates.ContentTemplateContainer.Controls.Add(new LiteralControl("</asp:GridView>"));
    }

我的问题是它没有在第一个 Status div 和第四个等旁边显示 URL div。 URL div 显示在最后。

我需要它在每个 div(文件)的 Status div 旁边显示 URL div。

我一直在尝试 GridView，所以任何建议都会有所帮助。

Answer 1

我不确定我是否理解这个问题，但对于你的问题“它没有在第一个状态 div 旁边显示 URL div，所以第四个。URL div 显示最后，”我建议如下:

<div class="row">
  <div class="textboxStatus">
  </div>
  <div class="textboxURL">
  </div>
</div>

将 float: left; 应用于 textboxStatus 和 textboxURL。我明白，这是动态生成的，但是为什么不用 AJAX 来获取内容然后简单地填充它呢？

您可以像这样轻松地将 AJAX 与网络表单一起使用:

http://encosia.com/using-jquery-to-directly-call-aspnet-ajax-page-methods/