Поместить изображение в выпадающий список программно ASP - PullRequest
0 голосов
/ 05 июля 2018

В коде позади я создаю элемент управления: выпадающий список с несколькими картинками.

DropDownList ddlEventIcone = new DropDownList();
ddlEventIcone.ID = "eventIconeDDL";
ddlEventIcone.Width = Unit.Pixel(110);

Затем я хочу поместить изображения внутри, чтобы получить их с карты, созданной так:

Dictionary<string, Image> iconeMapping = new Dictionary<string, Image>();
iconeMapping .Add(iconeName, myImage);

Я поместил их в ListItem, который я свяжу с выпадающим списком:

foreach (Image image in iconeMapping.Values.ToArray())
{
    lImageddl.Add(image.ImageUrl.Replace("~", "../.."));// the tild wasn't working
}

Я связываю свой список с раскрывающимся списком:

ddlEventIcone .DataSource = lImageddl;
ddlEventIcone .DataBind();

Я использую Javascript для уточнения типа элемента как Img:

foreach (ListItem listItem in ddlEventIcone.Items.Cast<ListItem>())
{
   listItem.Attributes.Add("class", "imageconverter");
 }

С помощью Javascript:

  $(function () {
            $(".imageconverter").each(function () {
                $(this).html('<img src="' + $(this).text() + '">');
            });
        });

Результатом является выпадающий список с «пустыми» параметрами, ничего не отображается (пустые строки), НО на исходной странице вот что я получил:

<select name="DigitalCalendarGrid$ctl09$eventIconeDDL" id="DigitalCalendarGrid_ctl09_eventIconeDDL" style="width:110px;">
        <option value="../../images/Event/cycling.png" class="imageconverter" width="10" height="10"><img src="../../images/Event/cycling.png"></option>
        <option value="../../images/Event/football.png" class="imageconverter" width="10" height="10"><img src="../../images/Event/football.png"></option>
    </select>

РЕДАКТИРОВАТЬ Точность: в Chrome DevTools, когда я провожу мышью по пути к изображению, он показывает изображение, но он говорит

0x0 pixels (Natural 256x256 pixels)
...