• Revista PROGRAMAR: Já está disponível a edição #53 da revista programar. Faz já o download aqui!

samuca

Formulário que é actualizado automaticamente

20 mensagens neste tópico

Estou a fazer um site em que precisava de ter um formulário que é actualizado à medida que vamos inserindo os dados. Passo a explicar: tenho um produto e escolho uma categoria, dentro de cada categoria existem várias subcategorias.

O que eu queria era, quando escolho a categoria, ele vai à base de dados buscar todas as subcategorias e actualiza o campos do formulário. Como faço isso? Já ouvi falar em Ajax, mas não percebo nada disso.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Já tive a pesquisar e penso que tenho que fazer o reload através de javascript. Alguém sabe fazer isso?

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

<script language="Javascript">
<!--

var URL   = "endereço da página"
var speed = 5000


function reload() {
location = URL
}

setTimeout("reload()", speed);
//-->
</script>

Bem se for o reload da página, mas este é automatico !

Se quiseres fazer aquando do enviar coloca este

<script language="Javascript">
<!--
function rld() {
document.location.reload()
}
//-->
</script>
<a href="javascript:rld()">Recarregar</a>

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Correcção:

<script language="Javascript">
<!--

var URL   = "endereço da página"
var speed = 5000;


function reload() {
window.location = URL;
}

setTimeout("reload()", speed);
//-->
</script>

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

isso do reload não faz sentido nenhum. Se no lado do servidor tiveres alguma linguagem do tipo PHP ou ASP então o que tu queres é POST ou GET e não reload. Claro que a versão que muda o window.location funciona se mandarem o parametro da combo seleccionada como parametro no URL. 'Reload' do mesmo URL não vai servir de nada.

Quanto ao AJAX não é nada de mais.  È simplesmente fazer pedidos asincronos ao servidor. Existem várias maneiras de fazer isto.

Se queres fazer à maneira normal só tens de ter uma combo dentro de um form que depois faz submit do dado, no servidor fazes a query à BD e preenches uma segunda combo.

Se quizeres fazer isso em AJAX avisa... mas será mais complexo o javascript que precisas de ter ao contrario da versão normal que nem sequer javascript é preciso.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Se quizeres fazer isso em AJAX avisa... mas será mais complexo o javascript que precisas de ter ao contrario da versão normal que nem sequer javascript é preciso.

Sim precisava de fazer isso da forma como descreves em AJAX... se puderes dar uma ajuda.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Simples, fazes uma em query POST ou GET o que der mais jeito para ti a um ficheiro em PHP onde faz uma query a base de dados. Depois só tens de configurar como tu queres o output, se quiseres eu programo-te isso a noite, mas agora tenho de ir para a escola.

Podes fazer isto tudo em AJAX.

Eu tou aqui as 8 horas da noite, se quiseres aguardar diz :)

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Onde eu preciso de ajuda é na parte do AJAX. Pelo que eu percebi, no php eu recebo a varialvel através do metodo POST e faço uma query ao servidor e é só fazer o output dessa query. Certo?

O output é feito de que forma? Escrever o código html do resto do form?

Não faço ideia é o JavaScript/AJAX que preciso...

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Se tens dúvidas em AJAX conselho-te uma framework que torna tudo mais simples, tens por exemplo o Prototype, e jQuery. Eu uso o Prototype, se tiveres tempo passa pela documentação.

Com ambas as frameworks podes progamar a resposta (output gerado pela função echo ou print do PHP), para um elemento HTML, ex: div, tr, td, p, etc ... desde que este esteja identificado pelo um id.

A resposta pode ser o que tu quiseres neste caso deves utilizar um drop down box, acho que é isso que tas a utilizar para escolher a categoria certo?

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Se tens dúvidas em AJAX conselho-te uma framework que torna tudo mais simples, tens por exemplo o Prototype, e jQuery. Eu uso o Prototype, se tiveres tempo passa pela documentação.

Com ambas as frameworks podes progamar a resposta (output gerado pela função echo ou print do PHP), para um elemento HTML, ex: div, tr, td, p, etc ... desde que este esteja identificado pelo um id.

A resposta pode ser o que tu quiseres neste caso deves utilizar um drop down box, acho que é isso que tas a utilizar para escolher a categoria certo?

Sim, é isso que eu estou a utilizar. Vou dar uma olhada nessas duas frameworks e vou ver se faço alguma coisa então...

Obrigado pela ajuda

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Se tens dúvidas em AJAX conselho-te uma framework que torna tudo mais simples, tens por exemplo o Prototype, e jQuery. Eu uso o Prototype, se tiveres tempo passa pela documentação.

Com ambas as frameworks podes progamar a resposta (output gerado pela função echo ou print do PHP), para um elemento HTML, ex: div, tr, td, p, etc ... desde que este esteja identificado pelo um id.

A resposta pode ser o que tu quiseres neste caso deves utilizar um drop down box, acho que é isso que tas a utilizar para escolher a categoria certo?

Sim, é isso que eu estou a utilizar. Vou dar uma olhada nessas duas frameworks e vou ver se faço alguma coisa então...

Obrigado pela ajuda

Já tive a ver as frameworks e também decidi utilizar a Prototype, já consegui fazer chegar o pedido ao servidor, e fazer aquilo que precisava com o php.

Agora não estou a conseguir actualizar o formulário, não sei se o problema é a receber os resultados ou a actualizar o formulário.

function sam_ajax(){	//Trata de enviar os dados através do AJAX da framework
             var cat = $F("cat");

new Ajax.Request('includes/subcat.php', 
{   
	method: 'get',   
	parameters: {cat: cat}   
}); 

new Ajax.Updater('subcat', 'includes/subcat.php', { 
	method: 'get',
	insertion: Insertion.Top  
});

}

o que eu quero é actualizar o formulário dentro de:

<select name="subcat" id="subcat"> </select>

O output do php são as tags <option></option> escritas por um echo.

Alguém pode dar uma ajuda?

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Não precisas de fazer um request e depois um updater.


function sam_ajax() {
             var cat = $F("cat");
     new Ajax.Updater('subcat', 'includes/subcat.php', {
	method: 'get',
	insertion: Insertion.Top  
	parameters: {cat: cat}   
}); 

}

Eu pelo menos uso assim.

Assim já deve dar.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Não precisas de fazer um request e depois um updater.


function sam_ajax() {
             var cat = $F("cat");
     new Ajax.Updater('subcat', 'includes/subcat.php', {
	method: 'get',
	insertion: Insertion.Top  
	parameters: {cat: cat}   
}); 

}

Eu pelo menos uso assim.

Assim já deve dar.

Já fiz progressos, já recebo e já actualizo o contúdo numa tag <div>, o problema é que o browser não interpreta o html que recebe, ou seja, recebe algo do género: <select><option>teste</option></select>  e a única coisa que aparece escrito é "teste" em vez de aparecer a caixa de selecção.

Edit: já consegui... o problema devia ser do browser

Obrigado a todos

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

E pronto, lá estou eu com problemas outra vez. Testei no IE7 e funcionou, só que agora testei no Firefox 2 e já não dá... É possível fazer isto funcionar no Firefox?

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Ok, então é assim, tenho o seguinte código no ficheiro onde tenho o formulário.

<script type="text/javascript">
function sam_ajax(){	//Trata de enviar os dados através do AJAX da framework
		var cat = $F("cat");

	new Ajax.Updater('subcat', 'includes/subcat.php', { 
		method: 'get',
		evalScripts: true,
		parameters: {cat: cat}  
	});
}
</script>


<td>
        <select name = "cat"  onchange="sam_ajax()" onfocus="sam_ajax()">
	<option value="1" selected="true">Exemplo</option>
	<option value="2" selected="true">Exemplo2</option>
       </select>
</td>
<td>Subcategoria:</td>
<td id="subcat">

</td>
</tr>

E a resposta do servidor é:

<?php
//Recebe a categoria do produto e devolve todas as categorias que lhe correspondem

include 'connect.php';

$cat = $_GET['cat'];

$query = "Select * from subcategorias where n_cat='$cat'";
$result = mysql_query($query,$conexao);

echo "<select name=\"subcat\">";
while ($consulta = mysql_fetch_array($result)){
		$num= $consulta["num"];
		$subcat = $consulta["subcat"];

		echo "<option value=\"$num\">$subcat</option>";
	}
echo "</select>";
?>

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Pois era o que eu tinha pensado. Muda esta linha:

<td><select name = "cat"  onchange="sam_ajax()" onfocus="sam_ajax()">

PARA

<td><select name = "cat" id = "cat"  onchange="sam_ajax()" onfocus="sam_ajax()">

Isto porque o IE usa o name para identificar os elementos e o firefox usa o id.  ;)

Força nisso!

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Pois era o que eu tinha pensado. Muda esta linha:

<td><select name = "cat"  onchange="sam_ajax()" onfocus="sam_ajax()">

PARA

<td><select name = "cat" id = "cat"  onchange="sam_ajax()" onfocus="sam_ajax()">

Isto porque o IE usa o name para identificar os elementos e o firefox usa o id.  ;)

Força nisso!

Muito obrigado RayBacK, já funciona... Tenho que começar a aprender Javascript

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Então pra mostrar como fiz, tá a funcionar bem.

Na página do formulário:

<script type="text/javascript">
function sam_ajax(){	//Trata de enviar os dados através do AJAX da framework
	var cat = $F("cat");

	new Ajax.Updater('subcat', 'includes/subcat.php', { 
		method: 'get',
		evalScripts: true,
		parameters: {cat: cat}  
	});
}
</script>

form method="post" action="<?php echo $PATH_INFO; ?>">
<table>
	<tr>
		<td>Categoria:</td>
		<?php
			$query = "Select * from categorias";
			$result = mysql_query($query,$conexao);
		?>
		<td><select name = "cat" id = "cat" onchange="sam_ajax()" onfocus="sam_ajax()">
				<?php 
					while ($consulta = mysql_fetch_array($result)){
						$num = $consulta["num"];
						$cat = $consulta["cat"];

						if ($categ == $num){
							echo "<option value=\"$num\" selected=\"true\">$cat</option>";
						}
						else{
							echo "<option value=\"$num\">$cat</option>";
						}
					}
				?>
			</select>
		</td>
	</tr>
	<tr>
		<td>
		<?php
			if ($categ == ""){
				$categ=1;
			}
			$query = "Select * from subcategorias where n_cat='$categ'";
			$result = mysql_query($query,$conexao);
		?>
		Subcategoria:
		</td>
		<td id="subcat">
			<select name="subcat">
				<option value="0">-----------</option>
				<?php 
					while ($consulta = mysql_fetch_array($result)){
						$num = $consulta["num"];
						$subcat = $consulta["subcat"];

						if ($subcateg == $num){
							echo "<option value=\"$num\" selected=\"true\">$subcat</option>";
						}
						else{
							echo "<option value=\"$num\">$subcat</option>";
						}
					}
				?>
			</select>
		</td>
	</tr>
	<tr>
		<td><input type="reset" name="reset" value="Limpar"></td>
		<td><input type="submit" name="sub1" value="Submeter"></td>
	</tr>
</table>
</form>

No servidor:

<?php
//Recebe a categoria do produto e devolve todas as categorias que lhe correspondem

include 'connect.php';

$cat = $_GET['cat'];

$query = "Select * from subcategorias where n_cat='$cat'";
$result = mysql_query($query,$conexao);

echo "<select name=\"subcat\">";
echo "<option value=\"0\">-----------</option>";
while ($consulta = mysql_fetch_array($result)){
		$num= $consulta["num"];
		$subcat = $consulta["subcat"];

		echo "<option value=\"$num\">$subcat</option>";
	}
echo "</select>";
?>

Obrigado pessoal pela vossa ajuda

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Crie uma conta ou ligue-se para comentar

Só membros podem comentar

Criar nova conta

Registe para ter uma conta na nossa comunidade. É fácil!


Registar nova conta

Entra

Já tem conta? Inicie sessão aqui.


Entrar Agora