Question

我有一个DropDownList，它被数据绑定到一个表，该表有一个简单的描述性文本列和一个ImageUrls列。当用户单击DropDownList中的选择时，图像将添加到div。我将DropDownList的AutoPostBack属性设置为true，以便用户可以更好地与页面进行交互。起初我认为事情很好，然后在测试时我发现如果用户从下拉列表中添加内容，则返回到列表项中的默认文本（“选择要添加的图片”），无论添加到div中的是什么会消失。如果用户随后选择要添加的不同图片，则新图片将与之前已消失的图片一起添加。有人可以帮我找出原因吗？

public partial class Webform1 : System.Web.UI.Page
{
    string imageListKey = "imageListKey";
    //List of images inside the div will be stored in Viewstate to they aren't lost
    //during postback
    List<string> ImagePaths
    {
        get
        {
            if (ViewState[imageListKey] == null)
                ViewState[imageListKey] = new List<string>();
            return (List<string>)ViewState[imageListKey];
        }
    }
    protected void Page_Load(object sender, EventArgs e)
    {
        //don't hit the database every time there's a postback
        string cs = ConfigurationManager.ConnectionStrings["dbcs"].ConnectionString;
        if(!IsPostBack)
        {
            using (SqlConnection con = new SqlConnection(cs))
            {
                using (SqlCommand cmd = new SqlCommand("select * from CardPictures", con))
                {
                    con.Open();
                    cmd.CommandType = CommandType.Text;
                    DropDownList2.AutoPostBack = true;
                    DropDownList2.DataTextField = "SideAffectName";
                    DropDownList2.DataValueField = "ImagePath";
                    DropDownList2.DataSource = cmd.ExecuteReader();
                    DropDownList2.DataBind();
                    DropDownList2.Items.Insert(0, new ListItem("Select picture to add", "-1"));
                }
            }
        }
    }
    protected void DropDownList2_SelectedIndexChanged(object sender, EventArgs e)
    {
        //don't allow duplicate values in ImagePaths
        if (!ImagePaths.Contains(DropDownList2.SelectedItem.Value))
        {
            if (DropDownList2.SelectedItem.Value != "-1")
            {
                ImagePaths.Add(DropDownList2.SelectedItem.Value);
                //foreach Image selected, add to testDiv
                foreach (string s in ImagePaths)
                {
                    testDiv.Controls.Add(AddImage(s));
                }
            }
        }
    }

    //to test that things are being added to the ViewState variable correctly
    protected void Button1_Click(object sender, EventArgs e)
    {
        foreach (string s in ImagePaths)
        {
            Response.Write(s + "<br/>");
        }
    }
    //adds an Image and setes the imageUrl to whatever is in the ViewState ImagePaths
    private Image AddImage(string imageUrl)
    {
        Image i = new Image();
        i.Height = 75;
        i.Width = 75;
        i.ImageUrl = imageUrl;

        return i;
    }
}

Answer 1

控件是动态创建的，不会以任何状态存储（ViewState或其他）。包含路径的字符串是，但不是动态图像控件本身。因此，当用户选择提示文本时，它们永远不会被重新创建，我假设返回值为-1，因此您永远不会在回发时重建图像容器

你应该做的是在它自己的方法中放置构建Image控件容器div的for循环，并在页面加载期间调用它，这样每次有回发时都会渲染它，并且只在选择事件时向ImagePaths集合添加字符串被解雇了。

Answer 2

您的问题出在SelectedIndexChanged事件处理程序中：

protected void DropDownList2_SelectedIndexChanged(object sender, EventArgs e)
{
    //don't allow duplicate values in ImagePaths
    if (!ImagePaths.Contains(DropDownList2.SelectedItem.Value))
    {
        if (DropDownList2.SelectedItem.Value != "-1")
        {
            ImagePaths.Add(DropDownList2.SelectedItem.Value);
            //foreach Image selected, add to testDiv
            foreach (string s in ImagePaths)
            {
                testDiv.Controls.Add(AddImage(s));
            }
        }
    }
}

当用户选择/选择“选择要添加的图片”时，您不会在回发时将项目添加回testDiv UI控件（这是if（DropDownList2.SelectedItem.Value！=“中的foreach） -1“）。你的代码应该是这样的：

protected void DropDownList2_SelectedIndexChanged(object sender, EventArgs e)
{
    //don't allow duplicate values in ImagePaths
    if (!ImagePaths.Contains(DropDownList2.SelectedItem.Value))
    {
        if (DropDownList2.SelectedItem.Value != "-1")
        {
            // Only add to the image paths list if it is not 'Select picture to add'
            ImagePaths.Add(DropDownList2.SelectedItem.Value);
        }
    }

    // Always put the images into the DIV
    //foreach Image selected, add to testDiv
    foreach (string s in ImagePaths)
    {
        testDiv.Controls.Add(AddImage(s));
    }
}

DropDownList的默认值从div中删除控件

2 个答案: