implementar combo ajax/jquery do tutorial

[11closed 0]

ola William Bruno to seguindo sua dica cara...

 

fis igual ao tuto ai mais ñ ta dano certo olha

 

essa linha é oq, ñ tenho esse arquivo jquer-1.3.2min.js ?

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

aq na function.inc.php

 

esqueceu de fecha o php "?>"

 

esse '123' é a senha do BD neh ?

 

ali na barra de status do browser acusa um erro

 

Detalhes dos erros da página da Web

Agente de Usuário: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; FDM; .NET CLR 1.1.4322; .NET CLR 2.0.50727; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; OfficeLiveConnector.1.4; OfficeLivePatch.1.3; AskTB5.5)

Carimbo de data/hora: Tue, 9 Mar 2010 01:07:23 UTCMensagem: Objeto esperado

Linha: 5

Caractere: 2

Código: 0

URI: http://localhost/testecombos/

 

alinha 5 da index.php é essa

$(document).ready(function(){//inicio o jQuery

quando eu seleciono um option do 1º select ñ acontece nd..

 

pq sera ?

 

t+

[William Bruno 1501]

essa linha é oq, ñ tenho esse arquivo jquer-1.3.2min.js ?

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

é a chamada pra bibliteca jQuery, se você não tem, então baixe !

pois sem ela não vai funcionar NUNCA!!

http://code.google.com/p/jqueryjs/downloads/detail?name=jquery-1.3.2.js

 

(não se esqueça de colocar no diretório correto, e renomear para .js)

 

aq na function.inc.php

 

esqueceu de fecha o php "?>"

não precisa fechar!

como não tem mais nada após isso ai no arquivo, simplesmente não precisa fechar ! é até uma boa prática, pois assim você não perde tempo do interpretador, procurando por uma tag de fechamento desnecessária.

 

 

esse '123' é a senha do BD neh ?

exatamente

ali na barra de status do browser acusa um erro

pq você não tem o arquivo do jquery, e sem ele vai aparecer um monte de erro mesmo.

 

quando eu seleciono um option do 1º select ñ acontece nd..

 

pq sera ?

 

baixa o jquery, e depois tente rodar o script.

 

coloca assim:

<script type="text/javascript">
        $(document).ready(function(){//inicio o jQuery
                alert( 'jQuery iniciado' );

se esse alert ai não rodar, não adianta nem tentar prosseguir.

[11closed 0]

fis oq falou

 

quando atualizo a pagina para fazer o teste aparece a alerta 'jQuery iniciado'

quando eu seleciono um option do 1º select ñ acontece nd..

 

os erros na barra de status parou..

 

na pag jquery-1.3.2.js ñ é precisso alterar nd ñ neh ?

 

t+

[William Bruno 1501]

não, não altere nada no arquivo jquery-1.3.2.js

 

Agora é hora de verificar a parte server-side então.

 

acessa diretamente lá:

http://localhost/function.inc.php?idCombo1=1

 

veja se aparece um objeto jSON, ou algum erro php.. se aparecer erro php, arrume, até aparecer algo do tipo:

{1: tal,}..

 

vou dividir esse topico, e criar um novo com as tuas duvidas no forum principal.

[11closed 0]

oK !!

 

apareceu varios erros aq ñ to consiguindo tira, mais apareceu tb oq você falow

 

isso

[{"nome":"","id":""}, {"nome":"","id":""}, ]

os erros quer permanecerão foram esses

 

Notice: Undefined variable: campo in D:\wamp\www\testecombos\function.inc.php on line 23
Notice: Trying to get property of non-object in D:\wamp\www\testecombos\function.inc.php on line 23
Notice: Undefined variable: campo in D:\wamp\www\testecombos\function.inc.php on line 23
Notice: Trying to get property of non-object in D:\wamp\www\testecombos\function.inc.php on line 23
Notice: Undefined variable: campo in D:\wamp\www\testecombos\function.inc.php on line 23
Notice: Trying to get property of non-object in D:\wamp\www\testecombos\function.inc.php on line 23
Notice: Undefined variable: campo in D:\wamp\www\testecombos\function.inc.php on line 23
Notice: Trying to get property of non-object in D:\wamp\www\testecombos\function.inc.php on line 23

fui no select para ver se algo muda, mais ñ ainda ñ esta acontecendo nd...

 

t+

[William Bruno 1501]

precisa tirar esses erros ai, e formar o jSON com valores, ai sim qndo você mudar o select vai ter dado certo.

troque:

$mysqli = new mysqli("localhost", "root", "123", "ajax");
                //$con = mysql_connect('localhost', 'root', '123');
                //mysql_select_db( 'ajax', $con );
                
                
                $q = $mysqli->query( $sql ); 
                //$q = mysql_query( $sql );
                
                
                $json = ' [';
                if( $q->num_rows > 0 )
                //if( mysql_num_rows( $q ) > 0 )
                {
                        while( $dados = $q->fetch_object() )
                        //while( $dados = mysql_fetch_assoc( $q ) )
                        {
                                $json .= '{"nome'.$campo.'":"'.$dados->nome.'","id'.$campo.'":"'.$dados->id.'"}, ';
                                //$json .= '{"nome'.$campo.'":"'.$dados['nome'].'","id'.$campo.'":"'.$dados['id'].'"}, ';
                        }
                }
                else
                        $json .= '{"nome'.$campo.'": "Não Encontrado"}';

por

$mysqli = new mysqli("localhost", "root", "123", "ajax");
		
		$query = $mysqli->query( $sql )or die( $mysqli->error ); 
		$json = ' [';
		if( $query->num_rows > 0 )
		{
			while( $dados = $query->fetch_object() )
			{
				$json .= '{"nome":"'.$dados->nome.'","id":"'.$dados->id.'"}, ';
			}
		}
		else
				$json .= '{"nome": "Não Encontrado"}';

e então arrume a conexão com o banco.

[11closed 0]

isso

 

muito obrigado William Bruno

 

agora vo incrementar aq ..

 

vlwww t+

[11closed 0]

ola

 

esta dano o erro

 

"Não Encontrado" dentro do 2º formulario

 

aonde estou errando sera ?

 

t+

[William Bruno 1501]

Não é erro, qr dizer que o SELECT não trouxe nada.

 

Confira a consulta.

[11closed 0]

William Bruno ñ sei oq eu fis aq bixo .. XD

 

quando eu seleciono o 1º select ñ acontece nd no segundo

 

a alert(data); ñ aparece.

 

tentei refazer tudo dinovo e aconteceu a msm coisa

por enquanto a unica coisa que mudei aq e o name do 1º select

 

pq sera ?

 

 

que teve que alterar essa linha

 

$("select[name='novonome']").change(function(){

tem mais algo que devo alterar ?

 

t+

[William Bruno 1501]

'tecnicamente' não.

Mas não entendi nada do que você disse.

 

Poste os teus códigos atuais, e a estrutura do banco de dados.

[11closed 0]

olha ai !!

 

<script type="text/javascript">    	
$(document).ready(function(){//inicio o jQuery
  $("select[name='categoria']").change(function(){
   var idCombo1 = $(this).val();//pegando o value do option selecionado
   //alert(idCombo1);//apenas para debugar a variável
    
    $.getJSON(//esse método do jQuery, só envia GET
    'function.inc.php',//script server-side que deverá retornar um objeto jSON
    {idCombo1: idCombo1},//enviando a variável
    function(data){
    //alert(data);//apenas para debugar a variável
    
	var option = new Array();//resetando a variável
	resetaCombo('combo2');//resetando o combo
	$.each(data, function(i, obj){
      option[i] = document.createElement('option');//criando o option                                            	
      $( option[i] ).attr( {value : obj.id} );//colocando o value no option                                            	
      $( option[i] ).append( obj.nome );//colocando o 'label'                                            	
      $("select[name='combo2']").append( option[i] );//jogando um à um os options no próximo combo                            	
	});
    });
  });
});

/* função pronta para ser reaproveitada, caso queira adicionar mais combos dependentes */   	
function resetaCombo( el )   {
$("select[name='"+el+"']").empty();//retira os elementos antigos  	
var option = document.createElement('option');                              	
$( option ).attr( {value : '0'} );            	
$( option ).append( 'Escolha' );            	
$("select[name='"+el+"']").append( option );    	
}
</script>

<li>Imóvel*: <select name="categoria" id="categoria">
      <option value="Filme">Filme</option>
      <option value="Seriado">Seriado</option>
      <option value="Novela">Novela</option>
      <option value="Documentario">Documentario</option>
      <option value="futebol">futebol</option>
      </select></li>
	<label>Quantos*: <select name="combo2">                    	
      <option value="0">Escolha</option>            	
	</select></label> 

function.inc.php

 

<?php
include("config.php");
header("Content-Type: text/html; charset=ISO-8859-1");    	
function intGet( $campo ){
  return isset( $_GET[$campo] ) ? (int)$_GET[$campo] : 0;
}
function retorno( $id ) {
  $sql = "SELECT `id`, `nome` FROM `combo2` WHERE `idCombo1` = {$id} ";            	
  $sql .= "ORDER BY `nome` ";
  $mysqli = new mysqli("$host", "$user", "$pass", "$bd");
  $query = $mysqli->query( $sql )or die( $mysqli->error );     			
  $json = ' [';            	
  if( $query->num_rows > 0 ) {                    	
   while( $dados = $query->fetch_object() ) {                            	
    $json .= '{"nome":"'.$dados->nome.'","id":"'.$dados->id.'"}, ';                    	
   }            	
  } else                            	
    $json .= '{"nome": "Não Encontrado"}';
    $json .= ']';
    return $json;
   
}
echo retorno( intGet('idCombo1') );

estruturas das tabelas

 

--
-- Estrutura da tabela `combo2`
--

CREATE TABLE IF NOT EXISTS `combo2` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `idCombo1` int(11) NOT NULL,
  `nome` varchar(50) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=7 ;

--
-- Extraindo dados da tabela `combo2`
--

INSERT INTO `combo2` (`id`, `idCombo1`, `nome`) VALUES
(1, 1, '1° Item do Combo1'),
(2, 1, '2° Item do Combo1'),
(3, 2, '1° Item do Combo1'),
(4, 2, '2° Item do Combo1'),
(5, 2, '3° Item do Combo1'),
(6, 3, '1° Item do Combo1');

--
-- Estrutura da tabela `combo1`
--

CREATE TABLE IF NOT EXISTS `combo1` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `nome` varchar(50) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=6 ;

--
-- Extraindo dados da tabela `combo1`
--

INSERT INTO `combo1` (`id`, `nome`) VALUES
(1, 'Filme'),
(2, 'Seriado'),
(3, 'Novela'),
(4, 'Documentario'),
(5, 'futebol');

ai esta

 

t+

[William Bruno 1501]

faz o seguinte ó:

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

troca por:

<script type="text/javascript">         
$(document).ready(function(){//inicio o jQuery
   alert( 'jQuery iniciado!' )

apareceu esse alert ai ?

 

não é possível, você não alterou nada!

se você não tentar entender o script, não tem como te ajudar.

 

como você quer conectar no banco, se você tá usando variáveis na conexão que não existem ?

releia este tópico desde o inicio.

[11closed 0]

ola William Bruno

 

apareceu sim,

 

agora esta dano a menssagem dentro do 2º select novamente "Não Encontrado"

 

na pagina function.inc.php?idCombo1=2

 

esta aparecendo isso

 

[{"nome":"1° Item do Combo1","id":"3"}, {"nome":"2° Item do Combo1","id":"4"}, {"nome":"3° Item do Combo1","id":"5"}, ]

esta certo neh ?

 

sobre as variaveis para conectar com o BD elas existem sim, como você pode ver elas estão dentro da include("config.php"); coloquei esse include na pagina function.inc.php

 

t+

[William Bruno 1501]

Ah tá!vi o erro, tá no teu HTML!!

<select name="categoria" id="categoria">
      <option value="Filme">Filme</option>
      <option value="Seriado">Seriado</option>
      <option value="Novela">Novela</option>
      <option value="Documentario">Documentario</option>
      <option value="futebol">futebol</option>
      </select>

troque por:

 

<select name="categoria">
      <option value="1">Filme</option>
      <option value="2">Seriado</option>
      <option value="3">Novela</option>
      <option value="4">Documentario</option>
      <option value="5">futebol</option>
      </select>

se quiser pesquisar pelo nome precisa alterar o SQL, e a forma de receber no php.

[11closed 0]

exatamente, era isso msm q estava errado, obrigado dinovo William Bruno

 

vou dexar por numeros msm !!

 

fis tipo assim

<li>categoria*: <select name="categoria" id="categoria">
      <option value="1">Filme</option>
      <option value="2">Seriado</option>
      <option value="3">Novela</option>
      <option value="4">Documentario</option>
      <option value="5">futebol</option>
</select></li>
<li>Genero*: <select name="combo2">             			
      <option value="0">Escolha</option>                
</select></li>

pricisso de outro formulario para ver quantos vai ser postado, tipo assim

<li>Quantos(as) idCombo1*: <select name="combo3">                 		
      <option value="0">Escolha</option>                
</select></li>

essa variavel "var idCombo1 = $(this).val();" // motra o value escolhido neh ?

tem alguma forma para apos escolher o select categoria, aparecer o value escolhido ali.

se for Filme fazer aparecer Quantos(as) Filmes*:

se for novela Quantas(as) novelas*:

 

e para criar esse formulario como combo3 tem alguma forma pratica ou tem que refazer o codigo todo trocando os combo2 por combo3. ?

 

obs: os values do combo3 vai ser apenas numeros tipo: 1, 2, 3, 4, 5, etc..

 

t+

[William Bruno 1501]

Sim, tem como sim.

 

Exemplo de como pegar o texto do option de um select:

<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	var options = $("select[name='categoria']").find('option');
	var tal = $( options ).eq(1).html();//segunda posição do array
	alert( tal );
});
</script>
</head>
<body>

	<label>Categoria*: <select name="categoria">
	  <option value="1">Filme</option>
	  <option value="2">Seriado</option>
	  <option value="3">Novela</option>
	  <option value="4">Documentario</option>
	  <option value="5">futebol</option>
	</select></label>
</body>

o teu combo3 não é estático ??

[11closed 0]

ola

esse "jquery.js" é a msm pag que usa no tutorial do combos, ou é outro ?

 

coloquei esse script aq olha

 

$(document).ready(function(){//inicio o jQuery
//alert( 'jQuery iniciado!' )
  $("select[name='imovel']").change(function(){
   var idCombo1 = $(this).val();//pegando o value do option selecionado
   //alert(idCombo1);//apenas para debugar a variável
   var options = $("select[name='imovel']").find('option');    	
   var tal = $( options ).eq(1).html();//segunda posição do array   	
   alert( tal );
....

tentei colocar tudo apos o scripts do combos

 

$(document).ready(function(){
	var options = $("select[name='imovel']").find('option');    	
var tal = $( options ).eq(1).html();//segunda posição do array   	
alert( tal );
});

mais dos dois jeito so aparece a alerta filme que é o primeiro, independentemente do que escolho aparece sempre filme. e como eu faria para imprimir o resultado la no <li>Quantos(as) (tal)*: teria que usar ajax ?.

 

 

como assim estático, oq você quis dizer ?

 

t+

[William Bruno 1501]

meu jquery.js é o mesmo, não liga pra isso não.

 

mude o numero dentro do eq()

te dei um exemplo, para mostrar que com o método html() você pega, não te dei o código pronto.

 

Ser sempre o mesmo == ser estático

 

ai no teu caso, você ja tem o $(this) para trabalhar. Pense um pouco.

para 'fazer aparecer', você pode usar qq método do jquery, q interaja com HTML.

[11closed 0]

ola

 

bom o script deu certo fis assim

 

$("select[name='imovel']").change(function(){
   var idCombo1 = $(this).val();//pegando o value do option selecionado
   //alert(idCombo1);//apenas para debugar a variável
   var options = $("select[name='imovel']").find('option');    	
   var tal = $( options ).eq($(this).val()).html();//segunda posição do array       
   alert( tal );

sim vai ser estático ... XD

o Select Combo3 vai ser assim, quando eu escolho Filme aparece o select quantos(as) tal*: se eu escolher 5 por ex: ai em baixo aparece 5 input para preencher.

 

t+