Question

从存储有其他项目的一定数量的图像中重新设计应用程序，以显示存储在第二个表格中的可变数量的图像。

发现了这个问题，并开始对其进行修改，但我有点迷失：ASP.Net Display Images in a GridView span across columns and rows? Using C#

我有构建asp.net页面的datalist控件，但知道路径项不起作用：

 <asp:DataList ID="dlImages" runat="server"
    RepeatColumns ="2"
    RepeatDirection ="Horizontal"
    RepeatLayout ="Flow">

    <ItemTemplate>
        <asp:Image ID="ImageQ" runat="server" Width="150px" ImageUrl='<%# Bind("ImageFile", "~/photo/{0}") %>' />
    </ItemTemplate>
</asp:DataList>

但是我试图将数据放入此列表中。最初通过以下方式加载图像数据以及其他信息：

protected void Page_Load(object sender, EventArgs e)
{
    string sConstr = ConfigurationManager.ConnectionStrings["CS1"].ConnectionString;
    SqlConnection Conn = new SqlConnection(sConstr);

    using (Conn)
    {
        SqlCommand command = new SqlCommand("QuestionDetail", Conn);
        command.CommandType = CommandType.StoredProcedure;
        command.Parameters.Add(new SqlParameter("@QuestionID", SqlDbType.BigInt));
        command.Parameters["@QuestionID"].Value = Convert.ToInt32(Request["Id"]);
        Conn.Open();
        SqlDataReader reader = command.ExecuteReader();

        while (reader.Read())
        {
            byte[] imgBytes = (byte[])reader["ImageFile"];
            string encodedBytes = Convert.ToBase64String(imgBytes);
            string url = string.Concat("data:image/jpg;base64,", encodedBytes);
            Image1.ImageUrl = url;

            byte[] imgBytes2 = (byte[])reader["ImageFile2"];
            string encodedBytes2 = Convert.ToBase64String(imgBytes2);
            string url2 = string.Concat("data:image/jpg;base64,", encodedBytes2);
            Image2.ImageUrl = url2;

            byte[] imgBytes3 = (byte[])reader["ImageFile3"];
            string encodedBytes3 = Convert.ToBase64String(imgBytes3);
            string url3 = string.Concat("data:image/jpg;base64,", encodedBytes3);
            Image3.ImageUrl = url3;

            byte[] imgBytes4 = (byte[])reader["ImageFile4"];
            string encodedBytes4 = Convert.ToBase64String(imgBytes4);
            string url4 = string.Concat("data:image/jpg;base64,", encodedBytes4);
            Image4.ImageUrl = url4;

            txt_QuestionID.Text = reader["Id"].ToString();
            txt_author.Text = reader["Author"].ToString();               
            txt_Date.Text = reader["SubmitDate"].ToString();               
            txt_Stem.Text = reader["Stem"].ToString();

            txt_RespA.Text = reader["RespA"].ToString();
            txt_RespB.Text = reader["RespB"].ToString();
            txt_RespC.Text = reader["RespC"].ToString();
            txt_RespD.Text = reader["RespD"].ToString();
            txt_RespE.Text = reader["RespE"].ToString();

            txt_Answer.Text = reader["Answer"].ToString();
            txt_Critique.Text = reader["Critique"].ToString();
            txt_KeyObjective.Text = reader["KeyObjective"].ToString();

            txt_References.Text = reader["References"].ToString();
            txt_Practice1.Text = reader["PracticeArea1"].ToString();
            txt_Practice2.Text = reader["PracticeArea2"].ToString();
            txt_Practice3.Text = reader["PracticeArea3"].ToString();
            txt_Practice4.Text = reader["PracticeArea4"].ToString();

            txt_IsCloneOf.Text = reader["IsCloneOf"].ToString();
        }

        reader.Close();
    }
}

我已经将Image部分取出并尝试通过单独的代码块将它们处理到DataList（并保持文本元素不变）并且具有将获取适用记录的存储过程。

页面加载的这一部分是根据附加到每个问题的图像数量正确加载占位符，但是如何读取编码图像而不是传递路径.....：

DataTable dt = new DataTable();
                using (Conn)
                {
                    SqlCommand ad = new SqlCommand("ImageDetail", Conn);
                    ad.CommandType = CommandType.StoredProcedure;
                    ad.Parameters.Add(new SqlParameter("@QuestionID", SqlDbType.BigInt));
                    ad.Parameters["@QuestionID"].Value = Convert.ToInt32(Request["Id"]);
                    SqlDataReader reader2 = command.ExecuteReader();
                    while (reader2.Read())
                    {
                        if(!Convert.IsDBNull(reader2["ImageFile"]))
                        { 
                        byte[] imgBytes = (byte[])reader2["ImageFile"];
                        string encodedBytes = Convert.ToBase64String(imgBytes);
                        string url = string.Concat("data:image/jpg;base64,", encodedBytes);
                        }
                    }
                    reader2.Close();
                    dt.Load(reader2);
                }
                dlImages.DataSource = dt;
                dlImages.DataBind();

仍然是一个总的菜鸟，每当我改变控制时，我需要花一些时间来弄清楚如何使用新的/。现在代码将运行没有错误,,,但也没有图像。我必须添加检查＆＃34; IsDBNULL＆＃34;因为我一直收到这个错误。我知道ImageDetail存储过程访问的表在任何记录中都没有空值，并且存储过程在输入QuestionID时返回记录。

Answer 1

终于能够弄明白了。

Datalist control：

<asp:DataList ID="dlImages" runat="server"
RepeatColumns ="2"
RepeatDirection ="Vertical"
CellSpacing ="20"
RepeatLayout ="Table">

<ItemTemplate>
 <asp:Image ID="Image1" runat="server" Height="200px" ImageUrl='<%# "GetImage.aspx?id=" + System.Convert.ToString(Eval("ImageID")) %>' /><br />
 <asp:Label ID="Label1" runat="server" Text='<%# Eval("ImageName") %>' Font-Bold="True" Font-Size="1.2em" ForeColor="Navy"/><br />
 <asp:Label ID="Label2" runat="server" Text='<%# Eval("ImageContent") %>' Font-Italic="true"/><br /> <br />
</ItemTemplate>

用于填充的DataTable定义（注意数据源先前已在页面加载事件中定义）：

DataTable dt = new DataTable();
                using (Conn)
                {
                    SqlDataAdapter ad = new SqlDataAdapter("SELECT QuestionID, Images2.ImageID, ImageFile, ImageContent, ImageName, SEQ_NUM from qimages join Images2 on qimages.imageid = images2.imageid where QuestionID = @QuestionID", Conn);
                    ad.SelectCommand.Parameters.Add("QuestionID", SqlDbType.BigInt).Value = txt_QuestionID.Text;
                    ad.Fill(dt);
                }
                dlImages.DataSource = dt;
                dlImages.DataBind();

最后，“GetImage.aspx”页面的代码检索并将图像传递给datalist。此页面仅使用后面的代码：

protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            string sImageID = Request.QueryString["id"];

            string constr = ConfigurationManager.ConnectionStrings["CS1"].ConnectionString;
            string sQuery = "SELECT ImageFile from Images2 WHERE ImageID = @ImageID";

            SqlConnection con = new SqlConnection(constr);
            SqlCommand cmd = new SqlCommand(sQuery, con);

            cmd.Parameters.Add("@ImageID", SqlDbType.Int).Value = Int32.Parse(sImageID);

            using (con)
            {
                con.Open();
                SqlDataReader DR = cmd.ExecuteReader();

                if (DR.Read())
                {
                    byte[] imgData = (byte[])DR["ImageFile"];
                    Response.BinaryWrite(imgData);
                }
            }
        }
    }

这是基于正在查看的问题将数据库编码图像显示在两列中。

感谢大家指点。

从数据库动态显示图像

1 个答案: