Ir para conteúdo

POWERED BY:

Arquivado

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

ehs171

[Resolvido] Calendário JS com JQuery

Por , em Javascript

Recommended Posts

ehs171    0

ehs171
Postado

Bom pessoa é o seguinte tenho uma pagina html que server para gerar um relatorio..

ai nessa pagina tenho um input do tipo text q recebe uma data...essa vem atravez do plgun jquery.click-calendario-1.0.js que estou utlizando

conssguigo fazerr ele funcionar beleza..move a data pra dentro do input e tudo mais....

link de onde eu peguei e fiz como base:

Calendario

 

mas o que acontece é o seguinte..tenho um menu drop down na pagina, que chamo as outras paginas por requisições ajax...que as carregam no centro..

o problema acontece q depois q chamo a pagina pela requisição ajax o calendario nao funciona...e se eu acessar ele direto funciona...

 

Index.php

<!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">'>http://www.w3.org/1999/xhtml">
<head>

<!-- Inicio Calendario-->
	<link href="../css/jquery.click-calendario-1.0.css" rel="stylesheet" type="text/css"/>
	<script type="text/javascript" src="../js/jquery.js"></script>
	<script type="text/javascript" src="../js/jquery.click-calendario-1.0-min.js"></script>		
	<script type="text/javascript" src="../js/dt.js"></script>
<!-- fim calendario data -->

<script language="javascript" src="js/ajax.js"></script>


<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
<title>Jamaica System</title>
<link rel="stylesheet" href="css/styles.css" type="text/css" />
</head>
<body>
<div id="wrap">
<div id="container">

	<div id="header">
		<h1><a href="/">JAMAICA SYSTEM</a></h1>
		<h2>Sistema de Gerenciamento de Ordem de Servio</h2>
	</div>
	<div id="nav">
		<?php
			require('menu.html');
		?>
		<br />
	</div>
	<div id="content">
		<div class="top-panel">
		<div>
			<h3>Colocar a Logo da Empresa Provavelmente!</h3>
			<p>Talvez colocar um descrio ou colocar menu de entrada e saida!<br /><br /></p>
		</div></div>
		<div class="page-wrap">
			<div class="page" id="page">
				
			<!-- begin main content -->
			doidodio
				<?php
					include('relatorio/Ordem_Servico.html');
				?>
			<!-- end main content -->
				
			</div>
			
		  <div class="clear"></div>
		</div>
	</div>
	<div id="footer">
		<p>© 2009.</p>
	</div>

</div>
</div>

</body>
</html>

relatorio.php

<!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" xml:lang="en" lang="en">
<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
	<meta name="author" content="Edilson" />
	
	<link href="../css/jquery.click-calendario-1.0.css" rel="stylesheet" type="text/css"/>
	<script type="text/javascript" src="../js/jquery.js"></script>
	<script type="text/javascript" src="../js/jquery.click-calendario-1.0-min.js"></script>		
	<script type="text/javascript" src="../js/dt.js"></script>
	
	<link rel="stylesheet" href="../css/padrao.css" type="text/css"/>
	
	<script>
		function buscacliente(){
				janela=window.open("../form/formbuscacliente.php","","width=500,height=500,scrollbars=no")		
				//interceptacao de erro na abertura da janela
			   text = "Se a janela nao estava abrindo\ntalvez seja porque voce tenha um\nprograma bloqueador de pop-up!\nObservacao  O windows XP service pack 2\nbloqueia pop-ups!";
				 if(janela == null) { alert(text); return; }
			   //fim
				 janela.moveTo(350,150);
		}
		
		function buscafuncionario(){
				janela=window.open("../form/formbuscafuncionario.php","","width=500,height=500,scrollbars=no")		
				//interceptacao de erro na abertura da janela
			   text = "Se a janela nao estava abrindo\ntalvez seja porque voce tenha um\nprograma bloqueador de pop-up!\nObservacao  O windows XP service pack 2\nbloqueia pop-ups!";
				 if(janela == null) { alert(text); return; }
			   //fim
				 janela.moveTo(350,150);
		}
	</script>

	<title>Relatrio de Ordem de Servio</title>
<style type="text/css">
<!--
.ng {
	font-weight: bold;
}
.r {
	text-align: right;
}
.ng {
	font-weight: bold;
}
.r {
	text-align: right;
}
.r {
	font-weight: bold;
}
-->
</style>
</head>

<body>
<h1 align="center"><b>Relatório de Ordem de Serviço</b></h1>

<form method="post" action="../relatorio/ordem_servico.php">

<table border="0" align="center">
<tr>
	<td class="r">Período.:</td>
	<td colspan="2">
		<input type="text" size="12" maxlength="10" name="dt_inicio" id="dt_inicio" readonly="" />
		 À  
		<input type="text" size="12" maxlength="10" name="dt_fim" id="dt_fim" readonly="" />
	</td>		
	</tr>
<tr>
	<td class="r">Funcionário.:</td>
	<td>
		<input type="text" size="60" maxlength="100" readonly="readonly" name="funcionario" id="funcionario" />
		<input type='hidden' name='cd_funcionario' id="cd_funcionario" />
	</td>
	<td><input type="button" name="Buscar" value="Buscar" onclick="buscafuncionario()"/></td>
</tr>
<tr>
	<td class="r">Situação.:</td>
	<td>
		<select size="1" name="status" id="status">
			<option value="T">Todas</option>
			<option value="1">Aberta</option>
			<option value="2">Em Processo</option>
			<option value="3">Pronta</option>
			<option value="4">Aguardando Cliente</option>
			<option value="5">Aguardando Peça</option>
		</select>
	</td>
	<td></td>
</tr>
<tr>
	<td class="r">Tipo.:</td>
	<td>
		<input type="radio" value="I" name="tipo" id="tipoi" />:. Interna 
		<input type="radio" value="E" name="tipo" id="tipoe" />:. Externa 
		<input type="radio" value="T" name="tipo" id="tipot" checked="" />:. Todas
	</td>
	<td></td>
</tr>
<tr>
	<td class="r">Cliente.:</td>
	<td>
		<input type="text" size="60" maxlength="100" readonly="readonly" name="cliente" id="cliente" />
		<input type='hidden' name='cd_cliente' id="cd_cliente" />
	</td>
	<td><input type="button" name="Buscar" value="Buscar" onclick="buscacliente()"/></td>
</tr>
<tr>
	<td class="r">Ordenação.:</td>
	<td>
		<input type="radio" value="data" name="ord" id="orddt" checked="" />:. Data 
		<input type="radio" value="cliente" name="ord" id="ordc" />:. Cliente
		<input type="radio" value="funcionario" name="ord" id="ordf" />:. Funcionário
	</td>
	<td></td>
</tr>
<tr>
	<td class="r"><input type="submit" value="ok" /></td>
	<td></td>
	<td></td>
</tr>
</table>

</form>
</body>
</html>

dt.js ///cham o calendario

//calendario de data!
$(document).ready(function(){
	
	$('#dt_inicio').focus(function(){
			$(this).calendario({ 
				target:'#dt_inicio',
				top:30,
				left:100
			});
		});
		
	$('#dt_fim').focus(function(){
			$(this).calendario({ 
				target:'#dt_fim',
				top:30,
				left:100
			});
		});
		
});

Compartilhar este post

Link para o post
Compartilhar em outros sites

Fabio Morikawa    0

Fabio Morikawa
Postado

olá,

 

seu problema é tranquilo...

 

seguinte... quando você carrega a página pela primeira vez é executado o onload "$(document).ready(function(){" ..

 

quando você faz uma requisição ajax esse onload da página não é executado..

 

portando o seu "novo" textbox de data não contém mais o evento focus para criar o calendário..

 

resolvendo o problema...

 

coloque em uma função os código de criar os calendários...

 

function criaCalendario(){

$('#dt_inicio').focus(function(){

$(this).calendario({

target:'#dt_inicio',

top:30,

left:100

});

});

 

$('#dt_fim').focus(function(){

$(this).calendario({

target:'#dt_fim',

top:30,

left:100

});

});

}

 

beleza... mude o código.. para isso..

 

$(document).ready(function(){

criaCalendario();

});

 

e agora.. toda vez que você requisitar uma página ajax... no final da requisição.. você chama a função..

 

criaCalendario();

 

obs:

atente-se para que todas as páginas tenha o mesmo nome no campo do calendário.. dt_inicio e dt_fim...

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