[DUVIDA] AJAX + JQUERY + PHP

Vencerrr · Junho 9, 2009

Manolos beleza?

Seguinte tenho uma aplicacao que usa o jquery.min.js para abrir o conteudo do menu em div dinamicamente. beleza ate ai ele consegue abrir a minha pagina em php desejada usando um require-once "cadastrar.php".

Acontece que nesta pagina cadastrar.php há também uma funcao em jquery para cadastrar os dados de um formulario. ( não usa action, usa-se o jquery para pegaros dados e mandar para a pagina data.php para processar e inserir no banco).

Assim que eu clico no botao cadastrar ele não faz nada. Agora quando eu chamo a pagina cadastrar.php no servidor ele realiza todas as operacoes corretamente. :wacko: Coisa de loko. há incompatibilidade de usar ajax dentro de ajax????

se quiserem todo conteudo so me falar q faço um .zip e mando para vocês.

no aguardo, vlws.

egue oscodes.

index.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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
&lt;script type="text/javascript" src="scripts/niftycube.js"></script>
&lt;script src="scripts/jquery.min.js" type="text/javascript"></script>


&lt;script>
  // When the document loads do everything inside here ...
     $(document).ready(function(){
     //Nifty("#menu a","small top transparent");
     //Nifty("#outcontent","medium bottom transparent");
     $('.content').load('carregar.php');    //by default initally load text from boo.php
         $('#menu a').click(function() { //start function when any link is clicked
                         //$(".content").slideUp("slow");
                         var content_show = $(this).attr("title"); //retrieve title of link so we can compare with php file
                            $.ajax({
                            method: "get",url: "carregar.php",data: "page="+content_show,
                            beforeSend: function(){$("#loading").show("fast");}, //show loading just when link is clicked
                            complete: function(){ $("#loading").hide("fast");}, //stop showing loading when the process is complete
                            success: function(html){ //so, if data is retrieved, store it in html
                            $(".content").show("slow"); //animation
                            $(".content").html(html); //show the html inside .content div
                     }
                 }); //close $.ajax(
         }); //close click(
     }); //close $(
</script>

<link rel="stylesheet" type="text/css" href="estilo_css/estilo1.css" />
<title>:: Passagem de turno</title>
</head>

<body>

<div id="loading">Carregando...</div>

<div class="page">


    <div>
        <ul id="menu">
            <li id="cadastro"><a href="#" title="cadastro">Cadastro</a></li>
            <li id="filtrar"><a href="#" title="filtrar">Filtrar</a></li>
            <li id="administracao"><a href="#" title="administracao">Administracao</a></li>
        </ul>
        <br style="clear:both;" />
    </div>
    
    <div id="outcontent">
        
        <div class="content"></div>
    </div>
</div>

</body>
</html>

carregar.php

<?php
/*
 * Created on 01/06/2009
 *
 * To change the template for this generated file go to
 * Window - Preferences - PHPeclipse - PHP - Code Templates
 */
 header("Cache-Control: no-cache");
 sleep(2);



 $p = $_GET['page'];

           switch($p) {
             case "cadastro": default : require_once "cadastro.php";
             break;
     
             case "filtrar": echo "oi";
             break;
             
              case "administracao": echo "adm";
             break;
          }             
     

?>

cadastro.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="pt-br" lang="pt-br" dir="ltr">
<head>
    <title>Cadastro ::</title>
    <!-- Inclui o Jquery -->
    &lt;script src="jquery-1.2.6.js" type="text/javascript"></script>
    <!-- Inclui o Actions que cont�m os comando escritos por n�s -->
    &lt;script src="actions.js" type="text/javascript"></script>
    <!-- Inclui o CSS para dar um ar de gra�a -->
    <link href="estilo_css/style.css" type="text/css" rel="stylesheet" />
</head>
<body>
<?PHP
// inclui arquivo de classe
include ("./acesso_bd.php");
// seta objeto para a classe
$banco = new DB;

//atribui valores para a conexao;

$banco->atribui_var('HOST','localhost');
$banco->atribui_var('USUARIO','root');
$banco->atribui_var('SENHA','bu');
$banco->atribui_var('NOME_DB','passagem_turno');


//conecta ao banco de dados
$banco->conectar();
$banco->seleciona_banco();
?>
<div id="loading">Carregando...</div>
Cadastro da passagem ::
<hr />

    <form name="f" id="f" onSubmit="return false">
        
        
        <label>Selecione o operador:</label>
        <select name="operador" id="operador">
        <?PHP
                    //Executa a consulta e monta o select
                    $banco->atribui_var('SQL','select * from usuarios');
                    if ($res = $banco->executa_query())
                    {
                        while ($row = mysql_fetch_array($res)) {
                            echo "<option value='$row[0]'>$row[1]</option>";
                        }
                    }
        ?>
        </select>
        
<br />
                <label>Selecione o site:</label>
                <select name="site" id="site">
                <?php
                    //Executa a consulta
                    $banco->atribui_var('SQL','SELECT * FROM site');
                    if ($res = $banco->executa_query())
                    {
                        while ($row = mysql_fetch_array($res)) {
                            echo "<option value='$row[0]'>$row[1]</option>";
                        }
                    }
                ?>
                </select>
                <br />
                <label>Selecione o sistema:</label>
                <select name="sistemas" id="sistemas">
                <?php
                    //Executa a consulta
                    $banco->atribui_var('SQL','SELECT * FROM sistema');
                    if ($res = $banco->executa_query())
                    {
                        while ($row = mysql_fetch_array($res)) {
                            echo "<option value='$row[0]'>$row[1]</option>";
                        }
                    }
                ?>
                </select>
                <br />
                <label>Informe a descrição:</label>
                <textarea name="descricao" id="descricao" rows="10" cols="50" wrap="off">Digite o texto aqui</textarea>
                <br />
        
        
        

        <br><br>
        <button id="btn1">Consulta</button>
        <input type="reset" class="reset button" name="name" value="value" />
    </form>
    <p> </p>
    <div id="d"></div>    
</body>
</html>

action.js

// Mesmo que window.onload
$(document).ready(function () 
{
    // cria um evento no click no botao btn1
    $("#btn1").click(function(){sendform()})
})

// Funcao que recupera e envia os dados para o data.php via post
function sendform()
 {
    // recupera os dados do form
    fnome = $('#nome').val()
    fmail = $('#mail').val()
    fbuceta = $('#******').val()
foperador = $('#operador').val()
fsite = $('#site').val()
fsistemas = $('#sistemas').val()
fdescricao = $('#descricao').val()
    
    // instancia o ajax via post informando o destino no caso data.php
    $.post("data.php",
    // envia os dados do form nas variaveis nome e mail
    {nome: fnome,
     mail: fmail,
     vagina:fbuceta,
     operador: foperador,
     site: fsite,
     sistemas:fsistemas,
     descricao: fdescricao,
    
    },
    // recupera as informacoes vindas do data.php
    function(data)
    {
      // se retornou 1 então os dados não foram enviados
      if(data == 1)
      { 
        // remove a classe css sucess da div
        $("#d").removeClass("sucess")
        // adiciona a classe error da div 
        $("#d").addClass("error")
        // insere na div o conteudo/mensagem de erro
        $("#d").html("Preencha todos os campos!")
      }
      else{
      // se não retornou 1 então os dados foram enviados
      // remove a classe error da div
      $("#d").removeClass("error")
      // adiciona a classe sucess na div 
      $("#d").addClass("sucess")
      // insere o conteudo vindo do data.php na div
      $("#d").html(data);
      }
      // torna a div invisivel
      $("#d").css("display","none");
      // torna a div visivel usando o efeito show com a slow de parametro
      $("#d").show("slow");
    }
    )
    // efeito show na div 
    $("#d").show("slow");
}

fiote · Junho 9, 2009

Já rodou no firefox (e/ou em qualquer navegador com debug/console de erros) pra ver se sua página tá apresentando algum erro de javascript? (especialmente na hora que clica no botão).

Se tiver algum erro, posta ae... fica mais fácil de analizar.

;)

Editado Junho 9, 2009 por fiote

Entrar

[DUVIDA] AJAX + JQUERY + PHP

Pergunta

Vencerrr

Link para o comentário

Compartilhar em outros sites

1 resposta a esta questão

Posts Recomendados

fiote

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades