Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

fecasvi

Ao clicar na figura da div o form inteiro vai para o começo.

Recommended Posts

Abaixo segue um trecho do código que uso o qual tenho tido o seguinte problema:
É um form que usa quase 2 telas para seu preenchimento e dentro sua estrutura é baseada em DIVs.
O problema é que quando clico na figura da div para exibir a DIV escondida para fazer a seleção do CHECKBOX, toda a minha página retorna ao topo, mas a minha DIV é exibida corretamente lá na posição onde ele foi chamada. O que acontece é que tenho de deslocar a tela até a posição no forma para poder fazer a marcação do CHEKBOX. Parece que os clics dados sempre levam meu form para o topo.
Como corrigir isso?

Segue abaixo exemplo do código.

<form id="form" method="post" ...>
<div class="linha">
<div class="c-1 box">
<div class="c-1 fundo">
<div class="c-3-4">
<div class="frg">
<label class="frm">Nome</label>
<div class="col-1">
<input type="text" id="aaa" name="xxx" class="frm-i" onblur="this.value=this.value.toUpperCase()" />
</div>
</div>
</div>
<div class="c-1-4">
.
.
.
</div>
.
.

. essa é a div para clicar na figura e exibir a div com o conteúdo a ser marcado no checkbox.

<div class="c-1-2">
<div class="frg has-error">
<label class="form-label" style="vertical-align:middle">Colaboradores:    <a href="#" onclick="document.getElementById('pop-colabora').style.display='block';"> <img src="../img/add_nomes.png" width="24" height="24" border="0" style="vertical-align:middle" /></a></label>
<div class="c-1">
<div id="pop-colabora" class="modelocx">
<div class="selecopc">
<table width="100%">
<tr>
<td width="40%" align="left"><font size="3" face="Verdana"><b>Colaboradores</b></font></td>
<td width="30%" align="right" valign="middle"><input type="button" value="OK" class="btn_p btn-submit" onclick="document.getElementById('pop-colabora').style.display='none'; seleccolabora();"></td>
<td width="30%" align="right" valign="middle"><input type="button" value="Fechar" class="btn_p btn-submit" onclick="document.getElementById('pop-colabora').style.display='none';"></td>
</tr>
</table>
</div>
<BR />
<font size="1" face="Verdana">Selecione o(s) Colaborador(es) e depois o botão OK.</font>
<div class="mostracont">
<DIV id="colabora"> <!-- exibe os dados vindos do banco -->
<!-- START BLOCK : block-colabora -->
<div><input name="colabora[]" id="colabora" type="checkbox" value="{ds}" style="vertical-align:middle" ><span style="vertical-align:middle"> {ds}</span></div><BR />
<!-- END BLOCK : block-colabora -->
</DIV>
</div>
</div> <!-- joga os valores selecionados na div pop-colabora -->
<textarea rows="4" name="colaborachk" id="colaborachk" readonly="readonly" cols="60"></textarea>
</div>
</div>
</div>
.
.
.

Dentro de <head> ficam as funções e a respectiva css para esconder as divs desnecessárias na abertura do form:
Obs: A CSS modelocx tem position="relative"

function seleccolabora(){
var colabora = "";
var obj = document.getElementById('colabora').getElementsByTagName('input');
var tam = obj.length;
var cnt = 0;
for(cnt = 0; cnt < tam; cnt++){
if(obj[cnt].checked == true){
colabora += obj[cnt].value+";\r\n";// o ponto e virgula é meu separador para fazer o split no outro lado da aplicação
}
}
document.getElementById('colaborachk').value = colabora;
}

Compartilhar este post


Link para o post
Compartilhar em outros sites

Se eu entendi bem sua duvida isso ocorre com a tag "a (anchor)" quando coloca href="#" se não tiver um id sendo informado geralmente ele joga para o topo algumas alternativas são

<a href="javascript:void(0)" onclick="myJsFunc();"> Link </a>

<a href="" onclick="jquery_stuff; return false;" />

um link com mais informações: http://stackoverflow.com/questions/493175/how-can-i-create-an-empty-html-anchor-so-the-page-doesnt-jump-up-when-i-click

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.