Tenho essa function que monta um grid em js
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', 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' });
}
E essa é a minha view onde o grid roda
<form id="form01" name="form01" method="POST" class="span12">
<input type="hidden" name="pEXEC" id="pEXEC" />
<input type="hidden" name="hidcodPrestadorTS" id="hidcodPrestadorTS" />
<fieldset id="fPrestador" style="padding-top:10px; padding-left:20px; background-color: #C7DDEB; border: 1px solid #599ACA">
<div class="row">
<div class="span4 input-append">
<label for="hidCodPrestadorTS">Código Prestador:</label>
<input type="hidden" name="hidCodPrestadorTS" id="hidCodPrestadorTS" class="span3" />
<input name="txtCodigoPrestador" id="txtCodigoPrestador" class="span3" type="text" style="width:190px" maxlength="9" onchange="BuscarPrestador();" />
<button class="btn" id="BuscarPrestadorPeloCodigo" type="button"><i class="icon-search"></i></button>
<span style="padding-right:5px"></span><input id="txtNomePrestador" class="span7" type="text" readonly />
</div>
</div>
</fieldset>
<div id="divConteudo" style="visibility:hidden; display:none">
<fieldset style="border: 1px solid #CCCCCC; padding: 10px 10px 10px 10px">
<div id="divGrid">
<table id="gridConteudo"></table>
</div>
</fieldset>
</div>
</form>
Bem, um barra de scroll é criada, mas não consigo rolar, sem que eu role o scroll da página. Gostaria de criar um scroll que não dependesse do scroll da página. Como eu faço isso?
Tenho a div divConteudo
oua table gridConteudo
Já fiz isso e não virou. Quanto ao tamanho já alterei para vários e continua a mesma coisa. Preciso mover o scroll da página.
<div id="divGrid" style="left: 300px; top: 150px; width: 450px; height: 220px">
<table id="gridConteudo"></table>
</div>