Ir para conteúdo

POWERED BY:

Arquivado

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

aprendizhtm

Pergunta teórica sobre JQuery

Por , em Javascript

Recommended Posts

aprendizhtm    3

aprendizhtm
Postado

Bom dia a todos!

 

Creio que essa seja uma dúvida muito simples, típica de iniciante mesmo. Estou usando JQuery para carregar páginas secundárias dentro de uma <div> de uma página principal. Em uma dessas páginas secundárias, estou tentando usar um script para selecionar todos os checkboxes dela, porém esse script só está funcionando se eu chamar o Jquery outra vez, dentro da própria página secundária.

 

O problema é que, ao chamar novamente o Jquery na página secundária, eu perco todos os outros recursos que foram chamados pelo JQuery da página principal. Como resolver este impasse?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Thiago Jourdan    3

Thiago Jourdan
Postado

Olá, aprendizhtm.

 

Eu precisaria do código deste problema pra pode checar melhor... Por um visto geral, não basta jQuery pra fazer isso, talvez vá usar Ajax... Vai ficar melhor depois que postar o código...

 

Aguardo resposta.

Thiago Jourdan.

Compartilhar este post

Link para o post
Compartilhar em outros sites

aprendizhtm    3

aprendizhtm
Postado

Olá, Thiago!

 

Desculpe, eu pensei que esta era apenas uma dúvida conceitual e por isso não postei nenhum código. As páginas são enormes, vou tentar isolar aqui só o que interessa, beleza? Abaixo, a página principal que mencionei:

<html>
<head>
</head>
<body>

[blablabla]

	<div class="loading">Carregando...</div>
	<div class="content"></div>

[blablabla]

<script src="jquery.js" type="text/javascript"></script>
<script src="plugins/plugin_jquery1.js" type="text/javascript"></script>
<script src="plugins/plugin_jquery2.js" type="text/javascript"></script>

</body>
</html>

Esta, uma das páginas secundárias que são chamadas via JQuery (contém apenas uma tabela e vários checkboxes gerados por foreach):

<table>
	<thead>
	<tr>
		<th><input type="checkbox" class="group-checkable" id="selectall" /></th>
	</tr>
	</thead>
	<tbody>
[blablabla]
<?php
	foreach{
?>
	<tr>
		<td class="inbox-small-cells">
		<input type="checkbox" class="checkboxes" name="check_list[]" value="<?php echo $variavel;?>">
		</td>
		<td><?php echo $outraVariavel;?></td>
	</tr>
<?php
	}
?>
	</tbody>
</table>

Aí eu achei UM MONTE de soluções pra selecionar todos os checkboxes, e praticamente todas funcionaram, mas com um único detalhe: eu deveria inserir novamente a chamada ao JQuery para o script funcionar. Veja algumas soluções:

<script src="jquery-1.9.1.js" type="text/javascript"></script>
<script type='text/javascript'>
$(document).ready(function () {
    $('#selectall').click(function () {
        $('.checkboxes').prop('checked', this.checked);
    });

    $('.checkboxes').change(function () {
        var check = ($('.checkboxes').filter(":checked").length == $('.checkboxes').length);
        $('#selectall').prop("checked", check);
    });
});
</script>

<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function()
{
	$("#selectall").click(function()				
	{
		var checked_status = this.checked;
		$('input[name="check_list[]"]:checkbox').each(function()
		{
			this.checked = checked_status;
		});
	});					
});
</script>

O detalhe é que, ao adicionar o Jquery outra vez, ocorrem dois problemas:

 

1. Perde-se a "referência" (se é que posso chamar assim) aos plugins jquery que foram carregados na página principal

2. Se eu recarregar todos os plugins de novo em cada página secundária, o carregamento das páginas vai ficar muito lento, e perde-se a finalidade da coisa.

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

não traga nenhum js na página q vai ser carregada.

 

deixe todo o js que vc precisar na página mãe. Ai utilize o .live() ou o .on() no estilo delegate.

Compartilhar este post

Link para o post
Compartilhar em outros sites

aprendizhtm    3

aprendizhtm
Postado

Eu coloquei este código na página mãe, logo abaixo da chamada ao JQuery:

<script type="text/javascript">
$(document).ready(function()
{
	$('#selectall').live('click', function () {
		var checked_status = this.checked;
		$('input[name="check_list[]"]:checkbox').each(function()
		{
alert('Teste');
			this.checked = checked_status;
		});
	});
});
</script>

O alert('Teste') executa tantas vezes quantos checkboxes houverem na página filha, mas os checkboxes não ficam marcados.

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

tenta assim:

<script type="text/javascript">

$(document).ready(function()

{

$('#selectall').live('click', function () {

var checked_status = $(this).attr('checked');

$('input[name="check_list[]"]:checkbox').each(function() {

$(this).attr('checked', checked_status);

});

});

});

</script>

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

depois de clicar no check marca todos, o que aparece no console de erros ?

 

Ctrl + Shift + J no Firefox

Compartilhar este post

Link para o post
Compartilhar em outros sites

aprendizhtm    3

aprendizhtm
Postado

Odeio quando tenho que dizer isso, mas... Não aparece nada.

 

Obs: Em um outro tópico meu, outros amigos do fórum já me apresentaram o Firebug e o Webdeveloper, ferramentas que eu desconhecia (eu ficava só no Console do Chrome mesmo).

 

Valeu, camarada, eu vou ficar tentando por aqui. :thumbsup:

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

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

  Aceito