Ir para conteúdo

POWERED BY:

Arquivado

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

Leob

[Resolvido] Clicar no botão e mostrar uma nova div com Jquery

Recommended Posts

Eu quero que quando a pessoa clicar em ok apareça a outra div com a pagina AddProd.php, Alguém pode me ajudar ?

 

<script language="JavaScript" src="../../js/funcoes.js"></script>
<script type="text/javascript" src="jquery.js"></script>

<script type="text/javascript">
$(document).ready(function() {
    $("input type=[button]").click(function(event) {
       $("#add").load('AddProd.php');
 });
});
</script>

 

<body>

<div id="info">
<form name="form1" id="form1">

  <p class="atuRegistros">SaÍda De Produtos</p>
	 <table width="880" border="0">
      <tr>
        <td width="172">Sede de envio:</td>
        <td width="698">
      <?php  
$sql = "Select * from sede WHERE sed_id='".$_SESSION['id_sede']."'";
$resultado=mysql_query($sql) or die(mysql_error());
$dados=mysql_num_rows($resultado);

while($dados = mysql_fetch_array($resultado)) {
$descr=$dados["sed_descr"];
echo $descr;
}
?>  </td>
      </tr>
      
      
   <tr>
        <td width="172">Selecione sede recebedora:</td>
        <td width="698"><select name="sede_recebe" id="sede">
          <?php 
	  
	  $sql="select * from sede";
	  $res=mysql_query($sql) or die(mysql_error());
      $dados=mysql_num_rows($res);

	  while($dados = mysql_fetch_array($res)) {
	  $id = $dados["sed_id"];
	  $sede=$dados["sed_descr"];
	echo "<option value=\"$id\">$sede</option>\n";
}
?>
       </select></td>
      </tr>
      
      
      <tr>
        <td>Informe o motivo da troca:</td>
        <td><textarea name="txtmotivo" id="txtmotivo" cols="45" rows="5"></textarea></td>
      </tr>
      <tr>
        <input type="button" value="ok" id="enviar">
        </td>
        <td> </td>
      </tr>
    </table>
</form>
</div>

<div id="add">

</div>
</body>
</html>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá Leob,

 

Conforme o aviso existente no fórum de origem deste post, não é permitida a postagem de dúvidas nesta área, motivo pelo qual este tópico será movido para o fórum principal deste assunto.

 

Tópico Movido

 

Artigos, Tutoriais e Matérias (Javascript/DHTML) http://forum.imasters.com.br/public/style_emoticons/default/seta.gif Javascript Frameworks

Compartilhar este post


Link para o post
Compartilhar em outros sites

Acho que a sua selecao esta errada, pelo menos eu nunca vi dessa forma..

    $("input type=[button]").click(function(event) {
eu faria:

$("input[type='button']").click(function(event) {
   alert( 'Funcionou o click!' );

veja se aparece o alert agora.

 

http://docs.jquery.com/Selectors/attributeEquals#attributevalue

 

mas assim, você seleciona todos os input de tipo button.. estranho.. era melhor especificar um poco.. ne?!

Compartilhar este post


Link para o post
Compartilhar em outros sites

<script language="JavaScript" src="../../js/funcoes.js"></script>
<script type="text/javascript" src="jquery.js"></script>

<script src="http://code.google.com/p/jqueryjs/downloads/detail?name=jquery-1.3.1...."type="txt/javascript"></script>

<script text='text/javascript'>

$(document).ready(function() {
    
	$("#enviar").click(function(event) {
	var envia=$('#envia').val();
	var receve=$('#recebe').val();
	var motivo=$('#motivo').val();
	
	if(envia=="")
	{
	alert('Selecione a sede de envio');
	$('#envia').focus();
	}
	else if(recebe=="")
	{
	alert('Selecione a sede recebedora');
	$('#recebe').focus();
	}
	else if(motivo=="")
	{
	alert('Selecione o motivo da transferência');
	$('#motivo').focus();
	}
	else
	{
	$('#hidden_envia').val(envia);
	$('#hidden_recebe').val(recebe);
	$('#hidden_motivo').val(motivo);
	$("div#add").show();
	}
	
 });
});

Eu modifiquei para isso e agora ela funciona só que descobri qual o problema.

 

eu criei uma pagina que contem um list/menu e dependendo do que o usuario escolhe ele é direcionado para uma pagina.

<? session_start();

include "conect.php";

$setor_func = $_SESSION['setor'];
$setor_id_func = $_SESSION['id_setor'];
$sede_id_func = $_SESSION['id_sede'];

?>

<html>
<head>
<link rel="stylesheet" type="text/css" href="../../css/login.css" />
<script language="JavaScript" src="../../js/funcoes.js"></script>
<script type="text/javascript" src="jquery.js"></script>

<script type="text/javascript">
$(document).ready(function() {

$("#enviar").click(function() {
var teste = $('#teste').val();
$('#conteudo').load('cadastrar_saida_'+teste+'.php');
});
});
</script>
</head>

<body>
<div id="conteudo">
<fieldset>

<p class="atuRegistros">Saidas de Produtos</p>
<fieldset>
<form name="frm">
Transferências entre: 
<select name="teste" input id='teste'>
      			       <option input value="sede">Sedes</option>
                           <option input value="setor">Setores</option>
                           </select>
                       <input type="button" name="enviar" value="Ok" id="enviar" />
</form>

</fieldset>
</fieldset>
</div>
<div id=opcao>

</div>




</body>

</html>

A pagina que abre dentro dessa DIV não funciona, mas se eu as abro separado do projeto elas funcionam. O que pode estar ocorrendo ?

Compartilhar este post


Link para o post
Compartilhar em outros sites

A pagina que abre dentro dessa DIV não funciona, mas se eu as abro separado do projeto elas funcionam. O que pode estar ocorrendo ?

 

Carrega por AJAX ne?!

Javascript trazido por AJAX realmente não funciona. Na ultima semana, pelo menos 2~3 por dia, tiveram problemas com isso.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Cara, indico alguns passos que podem te ajudar:

-> Não traga script via AJAX. Já deixe tudo oque você vai precisar na página que já está carregada.

-> Procure usar o método live(), para atrelar eventos em objetos que foram criados dinamicamente.

 

Eu pessoalmente, evitaria navegação com AJAX ^_^

Compartilhar este post


Link para o post
Compartilhar em outros sites

Estou meio perdido ainda e acredito que seja pedir demais mas você pode dar um exemplo com o metodo live() ?

 

Eu mudei para isso, as paginas que deveriam aparecer depois da escolha no list/menu na mesma pagina mas ainda da o mesmo problema, é o conflito do AJax ainda ?

 

<script>
$(document).ready(function(){

$('#enviar').click(function(){
	
var teste = $('#teste').val();

if(teste=="sede")
{
$('#sede').show();
$('#conteudo').hide();
}
else if(teste=="setor")
{
	$('#setor').show();
	$('#conteudo').hide();
}	
else
{
alert("Ops, Selecione a Opcao");
}
});
});

Compartilhar este post


Link para o post
Compartilhar em outros sites

Consegui fazendo assim =D ! Obrigado pela dica do método live()

 

<link rel="stylesheet" type="text/css" href="../../css/login.css" />
<script language="JavaScript" src="../../js/funcoes.js"></script>
<script language="JavaScript" src="../../js/jquery.js"></script>

<script>
$(document).ready(function(){

$("#span2").live('click', function(){
alert ("funciona dinamicamente");
}); 
		

$("#spanClick").click(function(){
var conteudo = '<span id="span2"><input type="button" name="botaox" value="OK"> </span>';
var teste = $('#teste').val(); 

if(teste=="sede")
{
$('#sede').show();
$('#conteudo').hide();
}
else if(teste=="setor")
{
	$('#setor').show();
	$('#conteudo').hide();
}	
else
{
alert("Ops, Selecione a Opcao");
}
		
});
});
</script>

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.