recarregando o jscript de forma incremental (erro)

barogana · Junho 17, 2014

Por gentileza, se alguém puder me orientar, ficarei muito agradecido.

Uso o firebug, para validar os erros, e deparei com uma condição estranha, à qual não consigo encontrar nenhuma referencia.
Acontece que a cada estando na página que chama uma rotina ajax o ajax carrega a página de execução corretamente.
Mas ao voltar para página chamadora, ele carrega duas vezes o script, e se retornar novamente, carrega por 3 vezes,
e assim sucessivamente, sempre incrementando.

Como sou meio ruim de explicar digitando vou postar o código:

Na página inicial (index), carrego todos os *.js (jquery, bootstrap, datatable(s).js

script chamado pelo menu, para listar a categoria de cursos

<?php
//área dos cursos
header("content-Type: text/html; charset=iso-8859-1");
require("../global/valida.php");
include_once("../global/global_functions.php");
GetS();
if ($session_logado=="n") {exit;};
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt-br" lang="pt-br">
<head>
<style></style>
</head>
<div class="abstract">
	<h4>Categorias</h4>
	<input type="button" id="inc-categoria" name="inc-categoria" value="Incluir" class="btn btn-primary">
		<div class="table-responsive">
			<table class="table table-striped table-bordered table-hover" id="tbl-categorias">
				<thead>
					<tr><th></th><th></th><th width='40px'>ID</th><th width='40px'>Ícone</th><th>Texto</th></tr>
				</thead>
				<tbody>
					<?php
					SingleConnect();
					$s ="select categoriaid,categorianome,icone from categorias order by categoriaid ";
					$s = mysql_query($s);
					while ($rs = mysql_fetch_array($s)) { 
					?>
					<tr class="gradeA">
						<td><a id="e<?php echo $rs['categoriaid'];?>" class="medit" href="#"><i class="fa fa-edit fa-fw"></i>   </a></td>
						<td><a id="d<?php echo $rs['categoriaid'];?>" class="mdel"  href="#"><i class="fa fa-trash-o fa-fw"></i></a></td>
						<td><?php echo $rs['categoriaid'];?></td>
						<td><?php echo GetIcone($rs['icone']);?></td>
						<td><?php echo $rs['categorianome'];?></td>
					</tr>
					<?php } ?>
				</tbody>
			</table>
		</div>
</div>					
	<script>
	$(window).load(function() {	$("#maincontainer").empty();})
	$(document).ready(function() {
		$("#carregando").hide();
		
		$('#tbl-categorias').dataTable();

		$(document).on('click', '#inc-categoria', function(){
			id = $(this).attr('id');
			id = id.substr(1);
			$.ajax({
				type: "GET",
				data: "modo=i&id=null",
				url: "resources/categorias/categorias_frm.php", 
				beforeSend: function(){  $("#carregando").show();},
				success: function(data) {
					$("#maincontainer").fadeIn("slow").html(data); 
					$("#carregando").hide();
					},
				oncomplete: function(){$("#carregando").hide();}
			});
		});

		
		$(document).on('click', '#tbl-categorias tbody tr td .medit', function(){
			id = $(this).attr('id');
			id = id.substr(1);
			$.ajax({
				type: "GET",
				data: "modo=e&id=" + id,
				url: "resources/categorias/categorias_frm.php", 
				beforeSend: function(){  $("#carregando").show();},
				success: function(data) {
					$("#maincontainer").fadeIn("slow").html(data); 
					$("#carregando").hide();
					},
				oncomplete: function(){$("#carregando").hide();}
			});
		});
		$(document).on('click', '#tbl-categorias tbody tr td .mdel', function(){
			id = $(this).attr('id');
			id = id.substr(1);
			$.ajax({
				type: "GET",
				data: "modo=d&id=" + id,
				url: "resources/categorias/categorias_frm.php", 
				beforeSend: function(){  $("#carregando").show();},
				success: function(data) {
					$("#maincontainer").fadeIn("slow").html(data); 
					$("#carregando").hide();
					}
			});
		});
	});
	</script>

<?php

?>

ao selecionar a categoria de curso no script acima, direciona para a página de manutenção (abaixo)

<?php
//cadastro,manutenção das categorias de cursos
header("Content-Type: text/html; charset=iso-8859-1");
require("../global/valida.php");
include("../global/global_functions.php");
GetS();
if ($session_logado == 'n') { exit; }
$modo			= isset($_GET['modo'])	? $_GET['modo'] :"null";
$categoriaid	= isset($_GET['id'])	? $_GET['id'] : "null";
$categorianome	= isset($_GET['categorianome']) ? $_GET['categorianome'] : "";
$icone			= isset($_GET['icone']) ? $_GET['icone'] : "";

if ($modo =="null"){ exit; }
if ($modo =="i"){	//incluir
}
if ($modo =="e"){	//editar
	if ($categoriaid !="null")
	{
		$sconn = SingleConnect();
		$sql = "SELECT * FROM categorias where categoriaid='" . $categoriaid ."'";
		$sql = mysql_query($sql);
		while ($rs = mysql_fetch_array($sql)) 
		{
			$categorianome 	= $rs['categorianome'];
			$icone	= "" . $rs['icone'];
		}
		CloseConn();
	}
}
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt-br" lang="pt-br">
<head>
<script>
$(window).load(function() {	$("#maincontainer").empty();})
$(document).ready(function () {
	$('.btn-processar').click( function() { 
		id = $(this).attr('id');
		modo = "<?php echo $modo; ?>"; 
		if ( (modo == "i") || (modo =="e") )
		{ 
			nr			=$("#tcategoriaid").val();
			txtlabel	=$('#tcategorianome').val();
			txticone	=$('#ticone').val();
			if (txtlabel==""){ShowMsg("Categorias","O campo Label precisa ser preenchido","Erro","err"); return false;}
			dtstring="modo="+modo+"&txtid="+nr+"&txtlabel="+txtlabel+"&txticone="+txticone;
			$.ajax({type: "POST", 
				url:		"resources/categorias/categorias_db.php", 
				data:		dtstring,
				dataType:	"json",
				success: 	function(json) {
					if (json.existe == 0)
					{
						ShowMsg ("Categorias", "Processado","Informação","inf");
						LoadPage("#maincontainer","resources/categorias/categorias.php");
						return false;
					} else {
						ShowMsg("Categorias","Erro ao processar","Erro","err");
					}
					$("#maincontainer").load("white.php");
					$("#maincontainer").load("resources/categorias/categorias.php");
					return false;
				}
			});
		}
	});
	
});
</script>
</head>
<style></style>
<div class="abstract">
<form class="form-horizontal" role="form">
	<?php	
		$lblicone = "Ícone " . GetIcone($icone);

		if ($modo == "i") { $read ="";} else {$read="readonly";}
		if ($modo =="i") {
			texto_2("ID","tcategoriaid",$categoriaid,"readonly");
		} else {
			texto_2("ID","tcategoriaid",$categoriaid,"readonly",false);
		}	
		texto_2("Texto","tcategorianome",$categorianome);
		texto_2($lblicone,"ticone",$icone);
		switch ($modo)
		{
			case "i": $lblvalue = "Incluir";break;
			case "e": $lblvalue = "Salvar";break;
			case "d": 
				if ($session_nivel <"4") { 
					$lblvalue =  "Negado excluir"; //só pode excluir se for um administrador do sistema
				} else {
					$lblvalue = "Excluir";break;
				}
		}
	?>
	<div class="form-group">
		<div class="col-md-10 col-sm-10 text-center">
			<input type="button" id="<?php echo $modo;?>" class="btn btn-primary btn-processar" value="<?php echo $lblvalue;?>">
		</div>
	</div>
</form>

</div>
<?php

?>

ao salvar, ou mesmo que volte para o menu inicial, quando selecionar uma categoria novamente( no primeiro script),

o módulo de manutenção irá carregar duas vezes, como abaixo:

linhas:

1) carregado normalmente, após chamar do menu principal;

2) listando as opções de categorias na tabela novamente, então ao selecionar uma categoria , agora passa a chamar

categorias_frm.php por duas vezes, e assim sucessivamente, sempre incrementando.


GET http://127.0.0.1/aaa/resources/categorias/categorias_frm.php?modo=e&id=2 200 OK 32ms	jquery-1.10.1.js (linha 8724)
GET http://127.0.0.1/aaa/resources/categorias/categorias.php                 200 OK 33ms	jquery-1.10.1.js (linha 8724)
GET http://127.0.0.1/aaa/resources/categorias/categorias_frm.php?modo=e&id=1 200 OK 40ms	jquery-1.10.1.js (linha 8724)
GET http://127.0.0.1/aaa/resources/categorias/categorias_frm.php?modo=e&id=1 200 OK 94ms	jquery-1.10.1.js (linha 8724)

paulojuchem · Junho 17, 2014

é bem provavel que seja isso:

Quando vc carrega a página, vc da um 'bind' no elemento #inc-categoria($(document).on('click', '#inc-categoria',....), esse bind vai continuar até vc recarregar a página completa, vc teria que dar um unbind, pelo visto ali vc usa jquery 1.9 ou +, ficaria algo assim:

..
$(document).off('click', '#inc-categoria');//aqui vc remove o listener do evento click atrelado ao #int-categoria
$(document).on('click', '#inc-categoria', function(){

eu não tenho certeza se é isso, mas testa, se for, vc vai ter que fazer isso com todos os .on ali em cima.

mas se eu fosse vc carregaria os js junto com o ajax e utilizaria direto $(elemento).click(...), é mais fácil de controlar

fonte: http://api.jquery.com/off/

barogana · Junho 17, 2014

wow...

por isto que não uso o forum antes de ter esgotado minha vã curiosidade e sofríveis fontes de pesquisas.

não passo uma semana, sem ler as dúvidas e as respostas dos participantes.

sou pouquíssimo assíduo a responder questões, pois estou sempre tão envolto em meu trabalho (sabe como é...

trabalhar em casa e buscar sustento para família e segurar uma conta de faculdade, embaralha o "céleblo", e não sou muito bom em explicar via TXT.

Mas sua resposta foi exata.

Valeu, valeu muito...

ressalva para o seletor que é o click na datatable:

$(document).off('click', '#tbl-categorias tbody tr td .medit');
$(document).on('click', '#tbl-categorias tbody tr td .medit', function(){

e sim...

eu sempre usava a sintaxe:

$(elemento).click(...),

mas como o seletor está dentro de uma datatable, este é o melhor procedimento, segundo as

informações do forum do próprio datatable.

mais uma vez, por milhares de vezes.... OBRIGADO.

tópico passível de ser fechado.

tks

Entrar

Arquivado

recarregando o jscript de forma incremental (erro)

Recommended Posts

barogana 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

paulojuchem 20

Compartilhar este post

Link para o post

Compartilhar em outros sites

barogana 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Fixar div até atingir uma certa altura

Ajuda com Extends e envio para o banco

PHP+Codeginiter - Orientação para Impressão

Este projeto é apoiado pelas empresas

Fóruns

Tempo Real

Informação importante