Ir para conteúdo

POWERED BY:

Arquivado

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

ricardo88

[Resolvido] Função Ajax

Recommended Posts

eai galera beleza..

 

estou desenvolvendo uma pagina de cadastrado que usa ajax/js/php para inserir os dados no mysql...

estou com um problema... creio q seja de js...

no Firefox funciona 100%

no IE 8 na hr do submit mostra erro, porem a inserção e validação ocorrem sem problemas..

 

 

 

Mensagem: Objeto esperado

Linha: 1

Caractere: 2

Código: 0

URI: http://192.168.2.3/agenda/admin.php

 

 

Mensagem: Objeto esperado

Linha: 1

Caractere: 2

Código: 0

URI: http://192.168.2.3/agenda/admin.php

 

 

 

alguem sabe o q pode ser?

codigo abaixo..

admin.php

<?php
require_once('config/conn.php');
$objLogin = new Login();
if (!$objLogin->verificar('index.php'))
   exit;
?> 

<!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">
<style type="text/css">
<!--
.topo a {
background-color: #FFF;
border: thin none #666;
float: right;
color: #F00;
font-weight: bold;
}
#apDiv1 {
position:absolute;
left:503px;
top:124px;
width:143px;
height:30px;
z-index:1;
}
.rodape {
color: #030;
text-align: center;
}
-->
</style>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ramais</title>
<link href="estilo.css" rel="stylesheet" type="text/css" />
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" language="javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" language="javascript" src="js/jquery.js"></script>
<script type="text/javascript" language="javascript" src="js/jquery.form.js"></script>
<script type="text/javascript" language="javascript">

$(function($) {
// Quando o formulário for enviado, essa função é chamada
$("#formulario").submit(function() {
	// Colocamos os valores de cada campo em uma váriavel para facilitar a manipulação
	var nome = $("#Nome").val();
	var ramal = $("#Ramal").val();
	var depto = $("#Depto").val();
	var grupo = $("#Grupo").val();
	var supervisor = $("#Supervisor").val();
	var gerencia = $("#Gerencia").val();
	var unidade = $("#Unidade").val();
	// Exibe mensagem de carregamento
	$("#status").html("<img src='loader.gif' alt='Enviando' />");
	// Fazemos a requisão ajax com o arquivo envia.php e enviamos os valores de cada campo através do método POST
	$.post('envia.php', {nome: nome, ramal: ramal, depto: depto, grupo: grupo, supervisor: supervisor, gerencia: gerencia, unidade: unidade}, 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("Mensagem enviada com sucesso!");
				// Coloca a mensagem no div de mensagens
				$("#mensagens").prepend("<strong>"+ nome +"</strong> ramal cadastrado: <em>" + ramal + "</em><br />");
				// Limpando todos os campos
				$("#nome").val("");
				$("#ramal").val("");
				$("#depto").val("");
				$("#grupo").val("");
				$("#supervisor").val("");
				$("#gerencia").val("");
				$("#unidade").val("");
			}
	});
});
});

function abrir(URL) {

	  var width = 490;
	  var height = 550;

	  var left = 99;
	  var top = 99;

	  window.open(URL,'janela', 'width='+width+', height='+height+', top='+top+', left='+left+', scrollbars=yes, status=no, toolbar=no, 		location=no, directories=no, menubar=no, resizable=yes');

	}


</script>
</head>
<body>
<div class="topo">
 <div>
 <p><img src="Logo.png" width="182" height="77" /></p>  
 </div>
 <p><? echo "<h3>Bem vindo " . $LoginUsuario; ?><a href="logout.php">Logout</a></p>
</div>
<div id="TabbedPanels1" class="TabbedPanels">
 <ul class="TabbedPanelsTabGroup">
   <li class="TabbedPanelsTab" tabindex="0">Cadastrar Ramal</li>
   <li class="TabbedPanelsTab" tabindex="0">Editar Ramal</li>
   <li class="TabbedPanelsTab" tabindex="0">Buscar e editar Ramal</li>
 </ul>
 <div class="TabbedPanelsContentGroup">
   <div class="TabbedPanelsContent">
     <div id="status" style="display: none;"></div>
     <fieldset>
       <legend>Ramal</legend>
       <form id="formulario" name="formulario" action="javascript: func()" method="post">
         <table width="434" border="0">
           <tr>
             <td colspan="2"><label>Nome Operador</label></td>
             <td colspan="2"><input type="text" name="Nome" id="Nome" /></td>
           </tr>
           <tr>
             <td colspan="2">Ramal</td>
             <td colspan="2"><input type="text" name="Ramal" id="Ramal" /></td>
           </tr>
           <tr>
             <td colspan="2">Departamento</td>
             <td colspan="2"><input type="text" name="Depto" id="Depto" /></td>
           </tr>
           <tr>
             <td colspan="2">Grupo</td>
             <td colspan="2"><input type="text" name="Grupo" id="Grupo" /></td>
           </tr>
           <tr>
             <td colspan="2">Supervisor</td>
             <td colspan="2"><input type="text" name="Supervisor" id="Supervisor" /></td>
           </tr>
           <tr>
             <td colspan="2">Gerência</td>
             <td colspan="2"><input type="text" name="Gerencia" id="Gerencia" /></td>
           </tr>
           <tr>
             <td colspan="2">Unidade</td>
             <td colspan="2"><input type="text" name="Unidade" id="Unidade" /></td>
           </tr>
           <tr>
             <td width="64"> </td>
             <td width="107"><input name="Cadastrar" type="submit" class="TabbedPanelsTabHover" id="Cadastrar" value="Cadastrar" /></td>
             <td width="55"> </td>
             <td width="190"><input name="Limpar" type="reset" class="TabbedPanelsTabHover" id="Limpar" value="Limpar" /></td>
           </tr>
         </table>
         <label><br />
           <br />
         </label>
       </form>
       <p> </p>
     </fieldset>
   </div>
   <div class="TabbedPanelsContent">

   			<h3>Ramais</h3>
     <?php
                   $sql = mysql_query("SELECT * FROM ramais ORDER BY id DESC");

                   echo "<ul>";
                   while($ramais = mysql_fetch_object($sql)) {

				echo "<li><a href=\"javascript:abrir('editRamal.php?id=".$ramais->id."');\">".$ramais->nome."</a></li>";					
                   }
                   echo "</ul>";
                   ?>            

   </div>
<div class="TabbedPanelsContent">
<? include("busca.php"); ?>
</div>
 </div>
</div>
<p>  </p>
<div class="rodape">Desenvolvido</div>
<body/>
<script type="text/javascript">
<!--
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");

 </script>


Compartilhar este post


Link para o post
Compartilhar em outros sites

o console do IE é bem ruim..

 

 

mesmo "funcionando" no Firefox, verifique se o console dele mostra algum alert, apertando Ctrl+Shift+J

Compartilhar este post


Link para o post
Compartilhar em outros sites

ok, assim de bate pronto, o único erro q identifiquei foi aquele action ali, troque para:

 

<form id="formulario" name="formulario" action="" method="post">

Compartilhar este post


Link para o post
Compartilhar em outros sites

ok, assim de bate pronto, o único erro q identifiquei foi aquele action ali, troque para:

 

<form id="formulario" name="formulario" action="" method="post">

 

 

eu ja fiz essa alteração, mas ai o submit nao passa pela validação do js

Compartilhar este post


Link para o post
Compartilhar em outros sites

qualquer validação que você queira, você deve fazer aqui dentro também:

 

        $("#formulario").submit(function() {

 

aliás, é a segunda vez q vejo esse código aqui no fórum, e alguém tendo problemas com ele.

Experimente este aqui meu:

 

http://wbruno.com.br/blog/2011/03/21/validar-enviar-formulario-ajax-usando-jquery-validate/

 

usei o jquery.validate para validar os campos, e o submitHandler para fazer o envio.

Funciona perfeitamente, e está muito melhor codificado do que este que você está usando.

Compartilhar este post


Link para o post
Compartilhar em outros sites

a validação do insert já esta nesse código

 

           // Exibe mensagem de sucesso
                                       $("#status").html("Mensagem enviada com sucesso!");
                                       // Coloca a mensagem no div de mensagens
                                       $("#mensagens").prepend("<strong>"+ nome +"</strong> ramal cadastrado: <em>" + ramal + "</em><br />");

 

 

se eu nao usar o javascript: func() no action do form.. nao executa esse bloco acima

Compartilhar este post


Link para o post
Compartilhar em outros sites

isso não tem nada a ver.

 

cadê a declaração do function func() ? entendeu ?

a única coisa q você precisa fazer, é impedir q o form seja enviado pelo HTML:

 

                                }
               });
               return false;//com esse return aqui
       });

 

esse javascript:func(); no action é um erro mesmo.

Compartilhar este post


Link para o post
Compartilhar em outros sites

o problema é q esse código está mal feito.

 

dá para fazer o mesmo, com muito menos código, de forma bem mais prática.

Compartilhar este post


Link para o post
Compartilhar em outros sites

o problema é q esse código está mal feito.

 

dá para fazer o mesmo, com muito menos código, de forma bem mais prática.

 

 

preciso colocar isso na intra da empresa logo..

 

 

quando estiver ok la.. vou fazer o mesmo usando o seu tutorial pra testar e aprender

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.