We help IT Professionals succeed at work.

Javascript - get data from db on form fill x 2

movieprodw
movieprodw asked
on
Hello,

I am using the below code to get the information form the database and it works fine. The issue is that I want to do it twice, I want to do it as it is to find the client data phone/address/etc as well as fine the city state when the zip is entered.

So what I need is so that I can name another field 'zipData' instead of ClientID. I did try to copy and paste the code I am using and changed the all of the instances where is said ClientID to zipData and it will not work.

I would love any help.
<script type="text/javascript" src="js/ajax.js"></script>
	<script type="text/javascript">
	/************************************************************************************************************
	Ajax client lookup
	Copyright (C) 2006  DTHMLGoodies.com, Alf Magne Kalleland
	
	This library is free software; you can redistribute it and/or
	modify it under the terms of the GNU Lesser General Public
	License as published by the Free Software Foundation; either
	version 2.1 of the License, or (at your option) any later version.
	
	This library is distributed in the hope that it will be useful,
	but WITHOUT ANY WARRANTY; without even the implied warranty of
	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
	Lesser General Public License for more details.
	
	You should have received a copy of the GNU Lesser General Public
	License along with this library; if not, write to the Free Software
	Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
	
	Dhtmlgoodies.com., hereby disclaims all copyright interest in this script
	written by Alf Magne Kalleland.
	
	Alf Magne Kalleland, 2006
	Owner of DHTMLgoodies.com
	
	
	************************************************************************************************************/	
	var ajax = new sack();
	var currentClientID=false;
	function getClientData()
	{
		var clientId = document.getElementById('clientID').value;
		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['clientForm'];	
		eval(ajax.response);
	}
	
	
	function initFormEvents()
	{
		document.getElementById('clientID').onkeyup = getClientData; // If you wish to have a lookup "as you type"
	}
	
	
	window.onload = initFormEvents;
	</script>

Open in new window

Comment
Watch Question

Ludwig DiehlSystems Architect

Commented:
could you  give us some more, like the html ( or part of it) so it can be easily understood? thx

Author

Commented:
Hello,

Well it is just a simple form:

<label>Email Address<span style="color:#F50">*</span><br />
<input type="text" class="input2" name="userId" id="clientID" value="" /></label><br /><br />

and the new one is

<label>Zip Code<span style="color:#F50">*</span><br />
<input type="text" class="input2" name="zip" id="zipCode" value="" /></label><br /><br />

The PHP for the clientID is:

<?php
/* Replace the data in these two lines with data for your db connection */
include ('db.php');

if(isset($_GET['getClientId'])){  
  $res = mysql_query("select * from members where userId='".$_GET['getClientId']."'") or die(mysql_error());
  if($inf = mysql_fetch_array($res)){
    echo "formObj.firstname.value = '".$inf["firstname"]."';\n";    
    echo "formObj.lastname.value = '".$inf["lastname"]."';\n";    
    echo "formObj.phonenumber.value = '".$inf["phonenumber"]."';\n";    
    echo "formObj.phonenumberext.value = '".$inf["phonenumberext"]."';\n";    
    echo "formObj.brokeredby.value = '".$inf["brokeredby"]."';\n";    
   
  }else{
    echo "formObj.firstname.value = '';\n";    
    echo "formObj.lastname.value = '';\n";    
    echo "formObj.phonenumber.value = '';\n";    
    echo "formObj.phonenumberext.value = '';\n";    
    echo "formObj.brokeredby.value = '';\n";        
  }    
}
?>

Author

Commented:
Hello again,

Below is the code I am using, they both work great unless they are on the same page, can someone please tell me what needs to be changed to let them work on the same form together.

I am assuming that I am erroring out the first one because of a call on the second one but I do not know enough about java to know what it is.
<script type="text/javascript">
	/************************************************************************************************************
	Ajax client lookup
	Copyright (C) 2006  DTHMLGoodies.com, Alf Magne Kalleland
	
	This library is free software; you can redistribute it and/or
	modify it under the terms of the GNU Lesser General Public
	License as published by the Free Software Foundation; either
	version 2.1 of the License, or (at your option) any later version.
	
	This library is distributed in the hope that it will be useful,
	but WITHOUT ANY WARRANTY; without even the implied warranty of
	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
	Lesser General Public License for more details.
	
	You should have received a copy of the GNU Lesser General Public
	License along with this library; if not, write to the Free Software
	Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
	
	Dhtmlgoodies.com., hereby disclaims all copyright interest in this script
	written by Alf Magne Kalleland.
	
	Alf Magne Kalleland, 2006
	Owner of DHTMLgoodies.com
	
	
	************************************************************************************************************/	
	var ajax = new sack();
	var currentClientID=false;
	function getClientData()
	{
		var clientId = document.getElementById('clientID').value;
		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['clientForm'];	
		eval(ajax.response);
	}
	
	
	function initFormEvents()
	{
		document.getElementById('clientID').onkeyup = getClientData; // If you wish to have a lookup "as you type"
	}
	
	
	window.onload = initFormEvents;
	</script>
	<script type="text/javascript">
	
	var ajax = new sack();
	var currentZipID=false;
	function getZipData()
	{
		var zipId = document.getElementById('zipID').value;
		if(zipId!=currentZipID){
			currentZipID = zipId
			ajax.requestFile = 'getClient.php?getZipId='+zipId;	// Specifying which file to get
			ajax.onCompletion = showZipData;	// Specify function that will be executed after file has been found
			ajax.runAJAX();		// Execute AJAX function			
		}
		
	}
	
	function showZipData()
	{
		var formObj = document.forms['clientForm'];	
		eval(ajax.response);
	}
	
	
	function initFormEvents()
	{
		document.getElementById('zipID').onkeyup = getZipData; // If you wish to have a lookup "as you type"
	}
	
	
	window.onload = initFormEvents;
	</script>

Open in new window

Vimal DMSenior Software Engineer

Commented:
Hai,

1) You better to use like this
getClient.php?getClientId='+clientId&'getZipId='+zipId  - and the data once when you echo from getClient.php  file echo with those values and split in  initFormEvents() function and use the same script to display any where that you want.

2) If the case of using the functions like this rename the second functions,because you can not use the same function name for all the process,which will throw error

Thanks

Author

Commented:
Hello,

It sounds like you know what you have a great idea how to fix this but it is hard for me to read what your saying and understand how to translate it to the code.

Could you please show me, I would really appreciate it, it has been a 24 ordeal.

Thanks for all of your great help.
Systems Architect
Commented:
try this. Hopw it is easy to understand. I tried to make it as easy as possible
project.zip

Author

Commented:
Amazing work! Thank you
Ludwig DiehlSystems Architect

Commented:
you are welcome!