ti-enxame.com

HTML - Alterar \ Atualizar o conteúdo da página sem atualizar / recarregar a página

Eu recebo os dados do banco de dados e os mostro em uma div ... o que eu quero fazer é quando clico em um link que deve alterar o conteúdo da div

uma opção é passar o parâmetro através do URL para si próprio e recarregar a página ...

Preciso fazer isso sem recarregar\atualizando ...

<?php   
    $id   = '1';

    function recp( $rId ) {
        $id   = $rId;
    }
?>

<a href="#" onClick="<?php recp('1') ?>" > One   </a>
<a href="#" onClick="<?php recp('2') ?>" > Two   </a>
<a href="#" onClick="<?php recp('3') ?>" > Three </a>

<div id='myStyle'>
<?php
    require ('myConnect.php');     
    $results = mysql_query("SELECT para FROM content WHERE  para_ID='$id'");

    if( mysql_num_rows($results) > 0 ) {
        $row = mysql_fetch_array( $results );
        echo $row['para'];
    }
?>
</div>

O objetivo é quando eu clico em qualquer um dos links, o conteúdo das variáveis ​​div e php é atualizado sem atualização .... para que o usuário possa ver novos dados e depois disso, se alguma consulta for realizada está na nova variável\s

ps Eu sei que vai exigir alguns AJAX, mas eu não conheço AJAX .. então, por favor responda com algo pelo qual eu possa aprender ... meu conhecimento é limitado a HTML, PHP, JavaScript e outros jQuery

37
Moon

Você tem a idéia certa, então aqui está como avançar: os manipuladores onclick são executados no lado do cliente, no navegador, para que você não possa chamar diretamente uma função PHP. Em vez disso, você precisa adicionar uma função JavaScript que (como você mencionou) usa AJAX para chamar um script PHP e recuperar os dados. Usando o jQuery, você pode fazer algo assim:

<script type="text/javascript">
function recp(id) {
  $('#myStyle').load('data.php?id=' + id);
}
</script>

<a href="#" onClick="recp('1')" > One   </a>
<a href="#" onClick="recp('2')" > Two   </a>
<a href="#" onClick="recp('3')" > Three </a>

<div id='myStyle'>
</div>

Em seguida, você coloca seu código PHP em um arquivo separado: (eu o chamei data.php no exemplo acima)

<?php
  require ('myConnect.php');     
  $id = $_GET['id'];
  $results = mysql_query("SELECT para FROM content WHERE  para_ID='$id'");   
  if( mysql_num_rows($results) > 0 )
  {
   $row = mysql_fetch_array( $results );
   echo $row['para'];
  }
?>
44
casablanca

o jQuery fará o trabalho. Você pode usar a função jQuery.ajax, que é geral para executar chamadas ajax, ou seus wrappers: jQuery.get, jQuery.post para obter/postar dados. É muito fácil de usar, por exemplo, confira este tutorial, que mostra como usar o jQuery com PHP.

2
Sorantis