Erro em Javascript

Front-end JavaScript
#1

Oi Pessoal,

Estou executando o método scrollIntoView mas não está apontando para o objeto que quero, já verifiquei o endereço que passei para o método e está correto. Tem algum meio de ver detalhes do porque ele não está funcionando? tipo um “show error” desse método?

Obrigado.

#2

Use as ferramentas de inspeção do navegador … ele mostrará no console o erro.

Se estiver usando Firefox, sugiro a instalção do Firebug;

Abs

#3

mudei no console para mostrar apenas o erros de javascript mas está aparecendo nada.
Como se não houvesse erro.

#4

Phgferreira.

Posta o HTML e JavaScript que você está usando pra gente dá uma olhada?

#5

JAVASCRIPT

comp = new CompRolagem('row_', 5, '', 3000);

function autoScroll() {
	// iniciar loop de rolagem automatica do componente
	setInterval(function(){
		// verifica se tem algum componente fora da janela.
		if (document.getElementById(comp.antes + (comp.indice + comp.limite) + comp.depois) != null) {
			// [FALHANDO SEM ERRO] move a rolagem para o item do indice
			document.getElementById(comp.antes + (comp.indice) + comp.depois).scrollIntoView({block: "start", behavior: "smooth"});
			// passa para o indice seguinte
			comp.indice++;
		} else {
			// caso não tenha componente fora da janela, volta para o primeiro componente
			comp.indice = 0;
		}
	},comp.pausa);
}

function CompRolagem(antes, limite, depois, pausa){
	this.antes = antes;
	this.depois = depois;
	this.indice = 0;
	this.limite = limite;
	this.pausa = pausa;
}

OBS: Estou usando JSF
PAGINA

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">

<h:head>
	<link rel="stylesheet" type="text/css" href="estilo.css" />
	<script type="text/javascript" language="javascript" src="js/autoScroll.js">
	</script>
</h:head>
<h:body onload="autoScroll()">

<h:form id="form">

	<p:scrollPanel id="janela" styleClass="janela_fixa">
	
	<p:dataGrid id="data_grid" var="leito" value="#{senirBean.leitos}" columns="1" emptyMessage="Nenhum Leito Pendente" rowIndexVar="i">
		
		<input id="row_#{i}" type="hidden" />
		...
	</p:dataGrid>
	
	</p:scrollPanel>
	
</h:form>
</h:body>
</html>
#6

Senhores, RESOLVIDO.

tive que trocar o scrollPanel por uma div e também tive que trocar o input do tipo hidden para uma div vazia.
OBS: não testei ainda para saber se tem haver, mas também inclui um style=“overflow: hidden” da div que ficou no lugar do scrollPanel. Segue abaixo o que tive que alterar no HTML:

PAGINA PRINCIPAL (HTML)

<p:dataGrid id="data_grid" var="leito" value="#{senirBean.leitos}" columns="1" emptyMessage="Nenhum Leito Pendente" rowIndexVar="i">
	
	<f:facet name="header">
		<p:outputLabel value="SENIR - Nucleo Interno de Regulação" />
	</f:facet>
	
	<div id="row_#{i}"></div>

… (resto do código) …

ESTILO.CSS
.janela_fixa {
overflow: hidden;
cursor: default;
width: 100%;
height: 543px;

1 curtida
#7

Boa, Man.

Obrigado por ter postado a solução :slight_smile: