I have this grid:
function CarregarGrid() {
$('#gridConteudo').jqGrid({
colModel: [{ width: 80, name: 'COD_OPERADORA', index: 'COD_OPERADORA', label: 'Operadora', formatter: GridOperadoraFormatter },
{ name: 'NOM_OPERADORA', index: 'NOM_OPERADORA', hidden: true },
{ width: 80, name: 'SITUACAO', index: 'SITUACAO', label: 'Situação' },
{ width: 90, name: 'DT_EXCLUSAO_OPERADORA', index: 'DT_EXCLUSAO_OPERADORA', label: 'Dt. Exclusão Operadora', sorttype: 'date', formatter: 'date', formatoptions: { srcformat: "d/m/Y", newformat: 'd/m/Y' } },
{ width: 130, name: 'COD_REDE', index: 'COD_REDE', label: 'Rede', formatter: GridRedeFormatter },
{ name: 'NOM_REDE', index: 'NOM_REDE', hidden: true },
{ width: 90, name: 'DT_EXCLUSAO_REDE', index: 'DT_EXCLUSAO_REDE', label: 'Dt. Exclusão Rede' },
{ width: 120, name: 'COD_PRESTADOR_SUBSTITUTO', index: 'COD_PRESTADOR_SUBSTITUTO', label: 'Prestador Substituto', formatter: GridPrestadorSubstitutoFormatter },
{ name: 'NOME_PRESTADOR_SUBSTITUTO', index: 'NOME_PRESTADOR_SUBSTITUTO', hidden: true },
{ width: 115, name: 'DESC_MOTIVO_EXCLUSAO', index: 'DESC_MOTIVO_EXCLUSAO', label: 'Motivo Exclusão' },
{ width: 95, name: 'DT_NOTIF_VOLUNTARIA', index: 'DT_NOTIF_VOLUNTARIA', label: 'Dt. Notificação Excl. Voluntária', sorttype: 'date', formatter: 'date', formatoptions: { srcformat: "d/m/Y", newformat: 'd/m/Y' } },
{ width: 90, name: 'DT_LIMITE_ATD', index: 'DT_LIMITE_ATD', label: 'Dt. Limite Realização', sorttype: 'date', formatter: 'date', formatoptions: { srcformat: "d/m/Y", newformat: 'd/m/Y' } },
{ width: 90, name: 'DT_LIMITE_REMESSA', index: 'DT_LIMITE_REMESSA', label: 'Dt. Limite Apresentação', sorttype: 'date', formatter: 'date', formatoptions: { srcformat: "d/m/Y", newformat: 'd/m/Y' } },
{ width: 90, name: 'DT_LIMITE_RECURSO', index: 'DT_LIMITE_RECURSO', label: 'Dt. Limite Reapresentação', sorttype: 'date', formatter: 'date', formatoptions: { srcformat: "d/m/Y", newformat: 'd/m/Y' } },
{ width: 90, name: 'DT_FIM_EXIBE_DIRECIONAMENTO', index: 'DT_FIM_EXIBE_DIRECIONAMENTO', label: 'Dt. Fim Exibe Site', sorttype: 'date', formatter: 'date', formatoptions: { srcformat: "d/m/Y", newformat: 'd/m/Y' } },
{ width: 100, name: 'OBSERVACAO', index: 'OBSERVACAO', label: 'Observação' }],
url: urlControle + '/GetPrestadorOperadora',
mtype: 'POST',
postData: { "pEXEC": function () { return $("#pEXEC").val(); }, "pCodPrestadorTS": function () { return $("#hidCodPrestadorTS").val(); } },
jsonReader: { repeatitems: false, root: function (obj) { return obj.Items; } },
datatype: "json",
autowidth: true,
shrinkToFit: false,
forceFit: true,
loadonce: true,
loadError: function (xhr, st, err) { $.notificacoes.erro("@TopSaudeResource.notificacao_erro_transacao"); },
loadComplete: function () {
if ($('#hidCodPrestadorTS').val() != '') {
var linhas = $("#gridConteudo").getDataIDs();
if (linhas.length <= 0) {
$('#divConteudo').hide();
$.notificacoes.erro("Prestador não está excluído em nenhuma Operadora e/ou Rede");
}
else {
$('#divConteudo').removeAttr('style');
$('#divConteudo').show();
}
}
}
});
$('#gridConteudo').jqGrid('setLabel', 'COD_OPERADORA', '', { 'text-align': 'left' });
$('#gridConteudo').jqGrid('setLabel', 'SITUACAO', '', { 'text-align': 'left' });
$('#gridConteudo').jqGrid('setLabel', 'DT_EXCLUSAO_OPERADORA', '', { 'text-align': 'left' });
$('#gridConteudo').jqGrid('setLabel', 'COD_REDE', '', { 'text-align': 'left' });
$('#gridConteudo').jqGrid('setLabel', 'DT_EXCLUSAO_REDE', '', { 'text-align': 'left' });
$('#gridConteudo').jqGrid('setLabel', 'COD_PRESTADOR_SUBSTITUTO', '', { 'text-align': 'left' });
$('#gridConteudo').jqGrid('setLabel', 'DESC_MOTIVO_EXCLUSAO', '', { 'text-align': 'left' });
$('#gridConteudo').jqGrid('setLabel', 'DT_NOTIF_VOLUNTARIA', '', { 'text-align': 'left' });
$('#gridConteudo').jqGrid('setLabel', 'DT_LIMITE_ATD', '', { 'text-align': 'left' });
$('#gridConteudo').jqGrid('setLabel', 'DT_LIMITE_REMESSA', '', { 'text-align': 'left' });
$('#gridConteudo').jqGrid('setLabel', 'DT_LIMITE_RECURSO', '', { 'text-align': 'left' });
$('#gridConteudo').jqGrid('setLabel', 'DT_FIM_EXIBE_DIRECIONAMENTO', '', { 'text-align': 'left' });
$('#gridConteudo').jqGrid('setLabel', 'OBSERVACAO', '', { 'text-align': 'left' });
}
I need to put a tooltip inside the OBSERVACAO
column. This is my tooltip I made (example I got on the net) and it works because I already tested it on a simple html page. The problem is to call within that grid. See the css mounts tooltip:
.tooltip {
position: relative;
font-size: 12px;
color: #039;
text-decoration: none;
cursor: help;
}
.tooltip:hover {
background: transparent;
color: #f00;
z-index: 25;
}
.tooltip span {
display: none;
}
.tooltip:hover span {
display: block;
position: absolute;
width: 210px;
top: 20px;
left: 0;
font-size: 12px;
padding: 5px;
border: 1px solid #999;
background: #e0ffff;
color: #000;
}
What do I call this from within the column above?