none
Mudar a cor de um trecho de texto dentro de um DropDownList RRS feed

  • Pergunta

  • Bom dia,

    Estou com um problema,

    Estou querendo alterar a cor tipo amarelo, apenas um trecho especifico de texto no caso abaixo o "( 10 )" que está dentro de um dropDownList e o "suco" com a cor preto.

    Alguém pode dar um help?

                                                                   

    <asp:DropDownList ID="ProdutosDropDownList" runat="server" Width="60px">

    <asp:ListItem> Suco (10) </asp:ListItem>
    ----
    </asp:DropDownList>

    Abraço!


    • Editado Wilian Silva segunda-feira, 29 de abril de 2013 13:03
    segunda-feira, 29 de abril de 2013 13:01

Todas as Respostas

  • Ola, acredito que o componente não permita fazer isso, se for para alterar o estilo da linha como um todo poderia ser:

    ddlProdutos.Items[0].Attributes.Add("style", "font-weight: bold");

    Ou adicionando um class:            

    ListItem item = new ListItem(Server.HtmlEncode("Produto - <strong>(10)</strong>"), "001");
    item.Attributes.Add("class", "itemModificado");
    ddlTeste.Items.Add(item);

    Ou então fazer tudo em jquery, mas acredito que daria um trabalho bacana caso não tenha tanta experiência. Veja:

    <select id="select">
        <option value="001">Produto1 (11)</option>
        <option value="002">Produto2 (23)</option>
        <option value="003">Produto3 (4)</option>
        <option value="004">Produto4 (33)</option>
    </select>
    var select = document.getElementById('select');
    $("#select > option").each(function() {
        var separado = this.text.split(' ');
        var html = separado[0] + '<span style="color:red;">' + separado[1] + '</span>';
        $('#'+this.id).text('');
        $('#'+this.id).append(html);
    });
    Resultado:

    O exemplo acima você pode rodar aqui: http://jsfiddle.net/rodrigorf/aF5V6/

    Acredito que um caminho seja procurar componentes de terceiros que fazem isso facilmente, ou criar o seu:

    http://www.telerik.com/products/aspnet-ajax/combobox.aspx


    Rodrigo Reis Ferreira
    Microsoft Certified


    segunda-feira, 29 de abril de 2013 19:55