How to change the color of Kendo UI Dropdownlist according to the Status variable?

Asked

Viewed 215 times

3

Can anyone tell me if there’s a way to change the color of Kendo’s Dropdownlist according to a Status variable?

For example:

If user is Active -> Assumes Green color

If user is Inactive -> Assumes Red color

If it is not possible to change the color, it can be a way to put a different icon, or some type of identifier per record.

css kendo-ui dropdown

1 answer

3


Good people... I looked in several places and could not change the color of the dropdownlist, but I was able to assemble with icons.... Follow the code to mount the Dropdownlist:

 var cliente = $("#cboCliente").kendoDropDownList({
    autoBind: true,
    filter: "contains",
    dataTextField: "Nome",
    dataValueField: "Id",
    dataSource: {
        serverFiltering: true,
        transport: {
          read: { url: urlBase + "/principal.php?ACAO=ComboClientes", dataType: "json", type: "POST", data: { MODULO: "Seguranca", TELA:"ClonarUsuario"} },
        },requestStart: function (e) {
           $(".clCarregando").show();
        },
        requestEnd: function (e) {
          $(".clCarregando").hide();
        }
    },
    valueTemplate: '<img class="selected-value" src="Imagens/#:Ativo#.png" style="width: 25px; vertical-align: middle;"/><span> &nbsp; #:Nome#</span>',
    template: kendo.template('<img class="selected-value" src="Imagens/#:Ativo#.png" style="width: 25px; vertical-align: middle;"/><span>  &nbsp; #:Nome#</span>'), });

The "Active" is what I call in valueTemplate and in the template comes from my database, so it can be filled with 0 or 1, since the field is bit. I created two images for active and inactive and gave them the name of 0 and 1. So when called it will load the corresponding image.

Browser other questions tagged css kendo-ui dropdown

You are not signed in. Login or sign up in order to post.