web-dev-qa-db-fra.com

Comment changer la couleur de la cellule jqGrid?

J'utilise la ligne suivante dans le $ (document) .ready (

$("#stSearchTermsGrid").setCell(2, 2, '', {color:'red'}) ;

mais ça ne marche pas. L'ai-je écrit de manière erronée ou placé au mauvais endroit.

Je sais que cette question a été posée plus d'une fois auparavant et c'est ainsi que j'ai obtenu la première ligne. Mais je ne suis toujours pas en mesure de le faire et je ne sais pas où est le problème.

17
Ahmad Farid

Vous avez raison, vous n'êtes pas la première personne à poser la question. Pour effacer la situation avec la couleur de la cellule que j'ai faite la démo

enter image description here

pour vous qui modifiez la couleur du texte de la cellule ou la couleur de fond de la vente de différentes manières:

loadComplete: function() {
    // 2 is zero-base index of the column 'name' ('Client'). Every from the options
    // multiselect:true, rownumbers:true and subGrid:true will increase
    // the index by 1 because the option inserts additional columns
    $("#6 td:eq(2)", grid[0]).css({color:'red'});

    grid.jqGrid('setCell',"12","name","",{color:'red'});
    grid.jqGrid('setCell',"10",'name', '', 'my-highlight');
    grid.jqGrid('setCell',"8",'name', '', 'ui-state-error ui-state-error-text');

    grid.jqGrid('setCell',"4","name","",{'background-color':'yellow',
                                         'background-image':'none'});
    grid.jqGrid('setCell',"3","name","",'ui-state-highlight');
}

<style type="text/css">
    .my-highlight { color: red; }
</style>

et "3", "4", "6", "8", "10" et "12" sont les rangées des rangées où la couleur de la colonne correspondante sera modifiée.

Soit dit en passant, mes favoris personnels sont les façons d'utiliser les classes 'ui-state-highlight' ou 'ui-state-error ui-state-error-text' qui font partie des jQuery UI Themes .

[~ # ~] mis à jour [~ # ~] : Pour comprendre la différence d'utilisation des différentes méthodes en cas d'utilisation d'un autre thème d'interface utilisateur jQuery J'ai ajouté ne autre démo utilisé le thème La Frog où le même tableau que ci-dessus ressemble à ce qui suit:

enter image description here

47
Oleg