Значение по умолчанию для DropDownList удаления элементов управления из div

Question

У меня есть DropDownList, который привязывается к таблице, которая имеет простой описательный текстовый столбец и столбец для ImageUrls. Когда пользователь нажимает кнопку выбора из DropDownList, изображение добавляется в div. У меня есть свойство AutoPostBack для параметра DropDownList равным 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

Ваша проблема заключается в обработчике события 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 на постбэка для того, когда выбирает пользователь/выбирает «Выбрать изображение, чтобы добавить» (это Еогеасп внутренняя часть, если (DropDownList2.SelectedItem.Value = «-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)); 
    } 
} 

Answer 2

Элементы управления создаются динамически и не сохраняются в каком-либо состоянии (ViewState или иным образом). Строки, содержащие пути, но не динамические элементы управления изображениями. Поэтому они никогда не воссоздаются, когда пользователь выбирает текст приглашения, который, как я полагаю, возвращает значение -1, и поэтому вы никогда не перестраиваете контейнер изображений при обратной передаче

Что вам нужно сделать, это установить цикл for, который создает Image control container div в собственном методе и вызывать его во время загрузки страницы, поэтому он визуализируется каждый раз, когда есть обратная передача, и только добавляет строки в коллекцию ImagePaths при запуске события выбора.