<li> 从 aspx 中的数据库参数动态添加,无需隐藏代码



我们正在尝试创建一个来自数据库的视频播放列表。我们希望从数据库中获取视频的路径并将其传递给一个li标签

,

  • 我们不知道如何使用或不使用代码隐藏技术
  • 我们只是想从表
  • 中添加带有路径参数的动态列表

反应。Write函数显示列表,但是在页面的顶部,我们想在一个特定的div中显示这些列表。

我们的后台代码

   using System;
   using System.Collections.Generic;
   using System.Linq;
   using System.Web;
   using System.Web.UI;
   using System.Web.UI.WebControls;
   using System.Data.SqlClient;
   using System.Data;
   using System.Configuration;
   namespace videoplayer
   {
       public partial class VideoPage : System.Web.UI.Page
       {
           SqlConnection con=new     SqlConnection(ConfigurationManager.ConnectionStrings["conn"].ConnectionString);
            //protected void Page_Load(object sender, EventArgs e)
            //{
            //}
            public void getdata()
            {
                String html=string.Empty;
                string a = string.Empty;
                string b = string.Empty;
                con.Open();
                SqlCommand cmd = new SqlCommand("Select Filename from VideoFile", con);
                SqlDataReader dr = cmd.ExecuteReader();
                while (dr.Read())
                {
                    html += "<li data-address='local9' class='playlistNonSelected' data-type='local' data-mp4Path='../media/video/1/main/02.mp4' data-ogvPath='../media/video/1/main/02.ogv' data-webmPath='../media/video/1/main/02.webm' data-imagePath='../media/video/1/main/02.jpg' data-description='<span class='infoTitle'>Nulla mauris justo</span><br><br>Aenean egestas. Donec vel sapien ultrices lorem laoreet viverra. Curabitur molestie gravida nisi. Vivamus elementum scelerisque lectus. Etiam interdum, nisi vel adipiscing gravida, leo tortor placerat ipsum, a eleifend velit tortor id ligula. Etiam quis leo a velit mollis vestibulum. Morbi consequat, odio eget feugiat mollis, enim erat dignissim ipsum, eget vehicula sapien metus non massa. Aliquam aliquet sagittis ligula. Sed adipiscing sodales ipsum. Mauris orci ligula, commodo vitae, commodo in, tempor eu, urna. Etiam justo ipsum, gravida vitae, tristique sed, porttitor ac, ipsum. Maecenas elit lectus, elementum id, fermentum eget, accumsan ac, quam. Duis lacinia urna ac nisi. Cras bibendum. In hac habitasse platea dictumst. Morbi iaculis volutpat dui. Pellentesque non leo.;<a href='' target='_blank'>Link</a>'<div class='playlistThumb'><img class='thumb' src='../media/video/1/preview/02.jpg' width='120' height='68' alt=''/></div><div class='playlistInfo'><p><span class='playlistTitle'>Video title goes here</span><br><span class='playlistContent'>Commodo vitae, commodo in, tempor eu, urna. Etiam justo ipsum maecenas nec tellus.</span></p></div></li>";
                    Response.write(html);
            }
           con.Close();
         }
      }
   }

这是我的aspx代码

<div class="playlistData">
  <ul id='playlist1' data-address="playlist1">
    <script language="c#" runat="server" id="123">
       public void Page_Load(object sender, EventArgs e)
         {
           getdata();
          }
    </script>
  <ul>

试试:c#

using System;
using System.Configuration;
using System.Data.SqlClient;
using System.Text;
using System.Web.UI.WebControls;
namespace videoplayer
{
    public partial class VideoPage : System.Web.UI.Page
    {
        SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["conn"].ConnectionString);
        protected void Page_Load(object sender, EventArgs e)
        {
            getdata();
        }
        private void getdata()
        {
            StringBuilder htmlBuilder = new StringBuilder();
            string a = string.Empty;
            string b = string.Empty;
            con.Open();
            SqlCommand cmd = new SqlCommand("SELECT Filename FROM VideoFile", con);
            SqlDataReader dr = cmd.ExecuteReader();
            while (dr.Read())
            {
                htmlBuilder.AppendLine("<li data-address='local9' class='playlistNonSelected' data-type='local' data-mp4Path='../media/video/1/main/02.mp4' data-ogvPath='../media/video/1/main/02.ogv' data-webmPath='../media/video/1/main/02.webm' data-imagePath='../media/video/1/main/02.jpg' data-description='<span class='infoTitle'>Nulla mauris justo</span><br><br>Aenean egestas. Donec vel sapien ultrices lorem laoreet viverra. Curabitur molestie gravida nisi. Vivamus elementum scelerisque lectus. Etiam interdum, nisi vel adipiscing gravida, leo tortor placerat ipsum, a eleifend velit tortor id ligula. Etiam quis leo a velit mollis vestibulum. Morbi consequat, odio eget feugiat mollis, enim erat dignissim ipsum, eget vehicula sapien metus non massa. Aliquam aliquet sagittis ligula. Sed adipiscing sodales ipsum. Mauris orci ligula, commodo vitae, commodo in, tempor eu, urna. Etiam justo ipsum, gravida vitae, tristique sed, porttitor ac, ipsum. Maecenas elit lectus, elementum id, fermentum eget, accumsan ac, quam. Duis lacinia urna ac nisi. Cras bibendum. In hac habitasse platea dictumst. Morbi iaculis volutpat dui. Pellentesque non leo.;<a href='' target='_blank'>Link</a>'<div class='playlistThumb'><img class='thumb' src='../media/video/1/preview/02.jpg' width='120' height='68' alt=''/></div><div class='playlistInfo'><p><span class='playlistTitle'>Video title goes here</span><br><span class='playlistContent'>Commodo vitae, commodo in, tempor eu, urna. Etiam justo ipsum maecenas nec tellus.</span></p></div></li>");
            }
            con.Close();
            Literal lit = new Literal();
            lit.Text = htmlBuilder.ToString();
            PlaceHolder1.Controls.Add(lit);
        }
    }
}

aspx文件:添加一个PlaceHolder

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="VideoPage.aspx.cs" Inherits="videoplayer.VideoPage" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div class="playlistData">
            <ul id='playlist1' data-address="playlist1">
                <asp:PlaceHolder ID="PlaceHolder1" runat="server"><asp:PlaceHolder>
            </ul>
        </div>
    </form>
</body>
</html>

充分利用Web Forms数据绑定。下面,我们将从数据库中获取数据到一个数据表中(它只是一些数据在内存中的表示),然后将该数据表绑定到一个Repeater。Repeater是一个定义了模板的控件,它将为绑定到它的集合中的每个项呈现模板为HTML。

此外,您需要将SqlConnection包装在using语句中,以确保它被正确处理。

public partial class VideoPage : System.Web.UI.Page
{
    public void getdata()
    {
        DataTable dt = new DataTable();
        using(SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["conn"].ConnectionString))
        {
            SqlCommand cmd = new SqlCommand("Select Filename from VideoFile", con);
            con.Open();                
            dt.Load(cmd.ExecuteReader());
        }
        VideoRepeater.DataSource = dt;
        VideoRepeater.DataBind();
    }
}

ASPX

<ul>
    <asp:Repeater id="VideoRepeater" runat="server">
        <ItemTemplate>
            <!-- You could do more HTML here -->
            <li><%# Eval("Filename") %></li>
        </ItemTemplate>
    </asp:Repeater>
</ul>

与@krlzlx所显示的技术相比,这种技术的优点是所有的HTML都将在ASPX页面中,而不是作为字符串嵌入到c#代码中。这样处理引号就更容易了,而且Visual Studio可以告诉你是否有语法错误。它还使您的逻辑保持整洁,并且您可以更容易地将HTML分成多行并缩进,等等。

相关内容

  • 没有找到相关文章

最新更新