JQuery para validar form sem refresh

[Fernando Neto MH 13]

Olá galera estou desenvolvendo um painel e queria saber como faço um envio de dados de um formulário sem refresh(recarregar a página).

Fiz assim:

<?php
include "../../config.php";

$query = mysql_query("SELECT * FROM config") or die (mysql_error());
while ($l     = mysql_fetch_array($query)){
$nomedosite     = $l['nomedosite'];
$enderecodosite = $l['enderecodosite'];
$emaildosite    = $l['emaildosite'];
}

?>
<script type="text/javascript" language="javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript">

$(function($) {
   // Quando o formulário for enviado, essa função é chamada
   $("#form_config").submit(function() {
   // Colocamos os valores de cada campo em uma váriavel para facilitar a manipulação
   var nomedosite = $("#nomedosite").val();
   var enderecodosite = $("#enderecodosite").val();
   var enderecodosite = $("#enderecodosite").val();
   // Exibe mensagem de carregamento
   $("#status").html("<img src='../../template/imagens/loading_pages.gif' alt='Carregando aguarde...' />");
   // Fazemos a requisão ajax com o arquivo envia.php e enviamos os valores de cada campo através do método POST
   $.post('update.php', {nomedosite: nomedosite, enderecodosite: enderecodosite, enderecodosite: enderecodosite }, 
   function(resposta) {
           // Quando terminada a requisição
           // Exibe a div status
           $("#status").slideDown();
           // Se a resposta é um erro
           if (resposta != false) {
               // Exibe o erro na div
               $("#status").html(resposta);
           } 
           // Se resposta for false, ou seja, não ocorreu nenhum erro
           else {
               // Exibe mensagem de sucesso
               $("#status").html("Dados atualizados!");
               $("#nomedosite").val("");
               $("#enderecodosite").val("");
               $("#emaildosite").val("");
           }
       });
   });
});


</script>
<div id="content">

<div id="bemvindo">
Configurações 
</div>
<div id="direita">
<a href="#" onclick="boxinfo();" id="verInfo">Ver informações</a>
</div>
<div id="status">

</div>
<form action="javascript:func()" method="post" enctype="multipart/form-data" id="form_config">
<table width="600" border="0" cellpadding="0" cellspacing="0" class="tabelaConfig">
 <tr>
   <th scope="col">Nome do site:</th>
   <th scope="col"><input name="nomedosite" type="text" id="nomedosite" value="<?php  echo $nomedosite ?>" /></th>
 </tr>
 <tr>
   <th scope="row">Endereço do site:</th>
   <td><label for="enderecodosite"></label>
     <input name="enderecodosite" type="text" id="enderecodosite" value="<?php  echo $enderecodosite ?>" /></td>
 </tr>
 <tr>
   <th scope="row">Email principal:</th>
   <td><label for="enderecodosite"></label>
     <input name="enderecodosite" type="text" id="enderecodosite" value="<?php  echo $emaildosite ?>" /></td>
 </tr>
 <tr>
   <th scope="row"> </th>
   <td> </td>
 </tr>
 <tr>
   <th scope="row"> </th>
   <td><input type="submit" name="button" id="button" value="Salvar dados" /></td>
 </tr>
</table>
</form>

</div>

 

e no UPDATE.PHP

 

<?php
include "../../config.php";
$nomedosite     = $_POST['nomedosite'];
$enderecodosite = $_POST['enderecodosite'];
$emaildosite    = $_POST['emaildosite'];

if($nomedosite == "" || $enderecodosite == "" || $emaildosite == ""){
echo 'Preencha todos os campos';
}
elseif (!eregi("^[a-z0-9_.-] @[a-z0-9_.-]*[a-z0-9_-] .[a-z]{2,4}$", $emaildosite)) {
   echo "Digite um email válido";
}else{
$update = mysql_query("UPDATE config SET nomedosite='".$nomedosite."', enderecodosite='".$enderecodosite."', emaildosite='".$emaildosite."'");
if($update){
	echo false;
}else {
       echo "Não foi possível modificar os dados.";
   }
}

?>

mas quando clico no botão para submit ele simplesmente não faz nada. Será o que em pessoal?

[Dian Carlos 29]

Veja > http://www.malsup.com/jquery/form/

[William Bruno 1501]

oq você fez está correto.

Apenas adicione um return false; no final do onsubmit para evitar q o comportamento html seja seguido.