[ajax]Trovato codice ajax giusto ma....problema!!

**lucas726** · 06-01-2007, 12:36

Ok ragazzi, ho trovato l'esempio ajax per completare altri campi di un form
inserendo i dati in uno solo a questa pagina:

http://www.dhtmlgoodies.com/index.ht..._client_lookup

Ho scaricato l'esempio e l'ho un po' sfoltito per semplicità, ecco il codice
delle 2 pagine (ajax.js a parte):
la pagina con il form:

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Generator" content="Dev-PHP 1.9.4">
<title>Document Title</title>
	<script type="text/javascript" src="js/ajax.js"></script>
	<script type="text/javascript">

	var ajax = new sack();
	var currentClientID=false;
	function getClientData()
	{
		var clientId = document.getElementById('clientID').value.replace(/[^0-9]/g,'');
		if(clientId.length==4 && clientId!=currentClientID){
			currentClientID = clientId
			ajax.requestFile = 'getClient.php?getClientId='+clientId;	// Specifying which file to get
			ajax.onCompletion = showClientData;	// Specify function that will be executed after file has been found
			ajax.runAJAX();		// Execute AJAX function			
		}
		
	}
	
	function showClientData()
	{
		var formObj = document.forms['clientForm'];	
		eval(ajax.response);
	}
	
	
	function initFormEvents()
	{
		document.getElementById('clientID').onblur = getClientData;
		document.getElementById('clientID').focus();
	}
	
	window.onload = initFormEvents;
	</script>

</head>
<body>
 <form name="clientForm"
action="cc.html" method="post"> <fieldset>
<legend>Client information</legend> <table>

<tr> <td>Client ID:</label></td> <td><input name="clientID"
id="clientID" size="5" maxlength="4"></td> </tr>
<tr> <td>First name:</label></td> <td><input name="firstname"
id="firstname" size="20" maxlength="255"></td> </tr>

</table> </form>
</fieldset>

</body>
</html>

questa invece la pagina php che interroga il db getClient.php:

Codice PHP:




<?php

/* Replace the data in these two lines with data for your db connection */

$connection = mysql_connect('localhost', 'root', '');

mysql_select_db('client', $connection);



if(isset($_GET['getClientId'])){

  $res = mysql_query("select * from ajax_client where clientID='".$_GET['getClientId']."'") or die(mysql_error());

  if($inf = mysql_fetch_array($res)){

    echo "formObj.firstname.value = '".$inf["firstname"]."';\n";



  }else{

    echo "formObj.firstname.value = '';\n";

     }

}

?>

Come ho detto rispetto all'originale sono un po' tagliate, ma anche in locale le pagine (dopo aver creato la tabella nel db ecc ecc) funzionano benissimo.

Il problema è che non sono riuscito a capire perchè adattandole alla pagina che mi interessa non funziona più.

Io ho provato a "ricopiare" il codice sopra nella mia pagina articoli.html:

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Generator" content="Dev-PHP 1.9.4">
<title>Form dati</title>
<style type="text/css">
	/* Big box with list of options */
	#ajax_listOfOptions{
		position:absolute;	/* Never change this one */
		width:175px;	/* Width of box */
		height:250px;	/* Height of box */
		overflow:auto;	/* Scrolling features */
		border:1px solid #317082;	/* Dark green border */
		background-color:#FFF;	/* White background color */
		text-align:left;
		font-size:0.9em;
		z-index:100;
	}
	#ajax_listOfOptions div{	/* General rule for both .optionDiv and .optionDivSelected */
		margin:1px;		
		padding:1px;
		cursor:pointer;
		font-size:0.9em;
	}
	#ajax_listOfOptions .optionDiv{	/* Div for each item in list */
		
	}
	#ajax_listOfOptions .optionDivSelected{ /* Selected item in the list */
		background-color:#317082;
		color:#FFF;
	}
	#ajax_listOfOptions_iframe{
		background-color:#F00;
		position:absolute;
		z-index:5;
	}
	
	form{
		display:inline;
	}
	
	</style>
	<script type="text/javascript" src="js/ajax.js"></script>
	<script type="text/javascript">

	var ajax = new sack();
	var currentClientID=false;
	function getClientData()
	{
		var clientId = document.getElementById('codice').value.replace(/[^0-9]/g,'');
		if(clientId!=currentClientID){
			currentClientID = clientId
			ajax.requestFile = 'getClient.php?getClientId='+clientId;	// Specifying which file to get
			ajax.onCompletion = showClientData;	// Specify function that will be executed after file has been found
			ajax.runAJAX();		// Execute AJAX function			
		}
		
	}
	
	function showClientData()
	{
		var formObj = document.forms['art'];	
		eval(ajax.response);
	}
	
	
	function initFormEvents()
	{
		document.getElementById('codice').onblur = getClientData;
		document.getElementById('codice').focus();
	}
	
	
	window.onload = initFormEvents;
	</script>

	<script type="text/javascript" src="js/ajax-dynamic-list.js"></script>
<SCRIPT LANGUAGE="javascript">
<!--
function validate_form()
{

    if (document.art.codice.value==document.art.codice.defaultValue ||
    document.art.codice.value.indexOf(' ',0)==0)
    {
        alert('\nNessun codice inserito.')
        document.art.codice.select()
        document.art.codice.focus()
        return false
    }
      if ((isNaN(document.art.codice.value)) ||  document.art.codice.value.indexOf('-',0)==0 ||  document.art.codice.value.indexOf('+',0)==0) {
   alert("Codice non valido.");
   document.art.codice.value = "";
   document.art.codice.focus();
   return false;
        }

    if (document.art.descrizione.value==document.art.descrizione.defaultValue ||
    document.art.descrizione.value.indexOf(' ',0)==0)
    {
        alert('\nNessuna descrizione inserita.')
        document.art.descrizione.select()
        document.art.descrizione.focus()
        return false
    }

    if (document.art.quantita.value==document.art.quantita.defaultValue ||
    document.art.quantita.value.indexOf(' ',0)==0)
    {
        alert('\nNessuna quantità inserita.')
        document.art.quantita.select()
        document.art.quantita.focus()
        return false
    }

    if (document.art.quantita.value.indexOf(',') >= 0){
   alert("Per i decimali utilizzare il punto, es: 4 chili e mezzo= 4.5");
   document.art.quantita.value = "";
   document.art.quantita.focus();
   return false;
        }

     if ((isNaN(document.art.quantita.value))|| document.art.quantita.value.indexOf('-',0)==0 ||  document.art.quantita.value.indexOf('+',0)==0) {
   alert("Quantità non valida.");
   document.art.quantita.value = "";
   document.art.quantita.focus();
   return false;
        }


    if (document.art.prezzo.value==document.art.prezzo.defaultValue ||
    document.art.prezzo.value.indexOf(' ',0)==0)
    {
        alert('\nNessun prezzo inserito.')
        document.art.prezzo.select()
        document.art.prezzo.focus()
        return false
    }

     if (document.art.prezzo.value.indexOf(',') >= 0){
   alert("Per i decimali utilizzare il punto, es: 3 euro e 55 cent = 3.55");
   document.art.prezzo.value = "";
   document.art.prezzo.focus();
   return false;
}

     if ((isNaN(document.art.prezzo.value))|| document.art.prezzo.value.indexOf('-',0)==0 ||  document.art.prezzo.value.indexOf('+',0)==0) {
   alert("Prezzo non valido.");
   document.art.prezzo.value = "";
   document.art.prezzo.focus();
   return false;
        }
}
//----------------------------------------
// -->
</SCRIPT>
</head>

<body bgcolor="#DAB88B" onload="document.art.codice.focus();" >
<TABLE border=0 width=100% cellpadding=3>
<tr>
<td width=100% colspan=2>
<p align=center>Inserisci Articoli
<form name="art" method="POST" action="fatt1.php" target="fatt1"  onSubmit="return validate_form()">
</td>
</tr>
<tr>
<td width=18%>Codice</td>
<td width=82%><input type=text name="codice" id="codice" size=10></td>
</tr>
<tr>
<td width=18%>Descrizione</td>
<td width=72%><input type="text" name="descrizione" id="descrizione" onkeyup="ajax_showOptions(this,'getCountriesByLetters',event)">
</td>
</tr>
<tr>
<td width=18%>Quantità</td>
<td width=82%><input type=text name="quantita"  size=10></td>
</tr>
<tr>
<td width=18%>Prezzo Un.</td>
<td width=82%><input type=text name="prezzo"  size=10></td>
</tr>
<tr>
<td width=18%>IVA</td>
<td width=82%><select size="1" name="iva">
  <option> 4</option>
  <option> 10</option>
  </select></td>
</tr>
<tr>
<td width=18%><input type="submit" name="invia" value="Inserisci"></td>
</tr>
</table>
</form>
</body>
</html>

la pagina php è la stessa ma modificata ovviamente:

Codice PHP:


<?php

/* Replace the data in these two lines with data for your db connection */

$connection = mysql_connect('localhost', 'root', '');

mysql_select_db('fattura', $connection);



if(isset($_GET['getClientId'])){

  $res = mysql_query("select * from prodotti where codice='".$_GET['getClientId']."'") or die(mysql_error());

  if($inf = mysql_fetch_array($res)){

    echo "formObj.descrizione.value = '".$inf["descrizione"]."';\n";

  }else{

    echo "formObj.descrizione.value = '';\n";

     }

}

?>

La pagina richiama i dati di una tabella prodotti nel db fattura con i campi id, codice e descrizione
No capisco, dovrebbe funzionare ma se inserisco il codice nel primo campo della pagina articoli.htm
nel campo descrizione non succede niente. Dov'è l'errore.
Ci può essere conflitto con l'altro codice javascript presente nella mia pagina html (usato per
controllare l'input e per creare una lista dinamica nel campo descrizione stesso)

Grazie

**lucas726** · 08-01-2007, 23:56

non vi viene in mente niente?
grazie

Discussione: [ajax]Trovato codice ajax giusto ma....problema!!

Strumenti discussione

Ricerca discussione

Visualizza

[ajax]Trovato codice ajax giusto ma....problema!!

Permessi di invio