Question

我在DropDownList中显示名称和图像。我已经通过Jquery插件完成了它。它现在正在工作。

我有来自数据的XML文件。这是xml文件的一个节点。

<ente>
    <name>Sydney</name>
    <img>abc_australia.png</img>
    <descri>ABC Radio Box 9994 GPO Sydney NSW 2001</descri>
    <nazione>AUSTRALIA - AUSTRALIA</nazione>
    <latitudine>-33.870652</latitudine>
    <longitudine>151.208895</longitudine>
    <zoom>-3</zoom>
  </ente>

我可以从xml文件中获取名称，并使用以下代码绑定下拉列表：

 protected void BindDataToGridviewDropdownlist()
      {
           XmlTextReader xmlreader = new XmlTextReader(Server.MapPath("XMLFILE.xml"));
           DataSet ds = new DataSet();
           ds.ReadXml(xmlreader);
           xmlreader.Close();


           if (ds.Tables.Count != 0)
       {
               ddlDetails.DataSource = ds;

               ddlDetails.DataTextField = "name";
               ddlDetails.DataValueField = "name";
               ddlDetails.DataBind();


    }     

 }

但是为了在dropdownlist中添加图像，我使用了这个jquery插件。

JQuery Plugin Link

在此插件中手动添加的图像和数据如下：

 <option value='TVSH - Rruga Ismail Quemali 11, Tirana' data-image="images/tvsh-albania.png" data-imagecss="flag ad"   data-title="TVSH - Rruga Ismail Quemali 11, Tirana">TVSH - Rruga Ismail Quemali 11, Tirana</option>

我想动态添加绑定下拉列表。（名称和图片）。我有图片文件夹中的所有图片。

代码对我有用。但我想动态绑定下拉列表。

有没有办法动态绑定下拉列表。

Answer 1

我建议使用jQuery插件Select2

使用Select2，您可以使用动态数据源，并为您的下拉列表选项添加模板。

根据Selecct2的模板示例，有一个示例代码，用于显示其名称旁边的国家/地区标志的图像：

function format(state) {
    var originalOption = state.element;

    return "<img class='flag' src='images/flags/" + state.id.toLowerCase() + ".png' alt='" + $(originalOption).data('foo') + "' />" + state.text;
}

$("#e4").select2({
            formatResult: format,
            formatSelection: format,
            escapeMarkup: function(m) { return m; }
        });

我提供的链接提供了您需要的所有代码示例。

这会回答你的问题吗？

需要使用asp.net在下拉列表中显示名称和图像

1 个答案: