473,372 Members | 1,043 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,372 software developers and data experts.

Auto fill form fields using coldfusion

769 512MB
Hey Everyone,

Well i don't know if my question should be in javascript/ajax or coldfusion, i figure this is more of a coldfusion question. But if this is in the wrong section let me know an all gladly delete my question an put it in the correct section.

Well what i am trying to do is pretty simple. I have a input field and someone starts typing in a customer number. As they type in the customer number the drop down box is populated. They then click on the drop down box an the rest of the form is populated (it gets all the information from a database).

I found a script online that does almost exactly what i want to do except it is in php. I have found an example of this in every language except coldfusion and well i must admit i am not good at converting code from one language to another.

But anyway i was wondering if anyone could provide me with an example on how i would do this in coldfusion instead of php? or if you know of a tutorial,forum, or example online i could look at?

Here is the example page
http://www.dhtmlgoodies.com/scripts/...nt-lookup.html

an here is the code
http://www.dhtmlgoodies.com/index.ht..._client_lookup

i already created the drop down box part of this (since it is missing in the
the example above), but like i said i just can't figure out how i would populate it using my coldfusion database. Here is what i got for the drop down box

here is coldfusion/html
Expand|Select|Wrap|Line Numbers
  1. <cfquery name="getcustnum" datasource="CustomerSupport">
  2. usp_CS_Getcontacts
  3. </cfquery>
  4. <HTML>
  5. <HEAD>
  6.     <TITLE>JavaScript Toolbox - Auto-Complete</TITLE>
  7. <SCRIPT LANGUAGE="JavaScript" SRC="autocomplete.js"></SCRIPT>
  8. </HEAD>
  9. <BODY BGCOLOR=#FFFFFF LINK="#00615F" VLINK="#00615F" ALINK="#00615F">
  10. <FORM>
  11. Customer Number*
  12. <INPUT TYPE="text" NAME="input1" VALUE="" ONKEYUP="autoComplete(this,this.form.options,'value',true)" onChange="validate(this.form.custnum,'Customer Number')">
  13. <SELECT NAME="options" 
  14. onChange="this.form.input1.value=this.options[this.selectedIndex].value" onclick="">
  15. <cfoutput query="getcustnum">
  16. <option value="#fk_custNum#">#fk_custNum#</option>
  17. </cfoutput>
  18. </SELECT>
  19. Company Name:<input type="text" name="compname"  size="20" id="compname"/>
  20. First Name:<input type="text" name="fname"  size="20" id="fname"/>
  21. Last Name:<input type="text" name="lname"size="20" id="lname"/>
  22. </FORM>
  23. </BODY>
  24. </HTML>

here is the javascript
Expand|Select|Wrap|Line Numbers
  1. function autoComplete (field, select, property, forcematch) {
  2.     var found = false;
  3.     for (var i = 0; i < select.options.length; i++) {
  4.     if (select.options[i][property].toUpperCase().indexOf(field.value.toUpperCase()) == 0) {
  5.         found=true; break;
  6.         }
  7.     }
  8.     if (found) { select.selectedIndex = i; }
  9.     else { select.selectedIndex = -1; }
  10.     if (field.createTextRange) {
  11.         if (forcematch && !found) {
  12.             field.value=field.value.substring(0,field.value.length-1); 
  13.             return;
  14.             }
  15.         var cursorKeys ="8;46;37;38;39;40;33;34;35;36;45;";
  16.         if (cursorKeys.indexOf(event.keyCode+";") == -1) {
  17.             var r1 = field.createTextRange();
  18.             var oldValue = r1.text;
  19.             var newValue = found ? select.options[i][property] : oldValue;
  20.             if (newValue != field.value) {
  21.                 field.value = newValue;
  22.                 var rNew = field.createTextRange();
  23.                 rNew.moveStart('character', oldValue.length) ;
  24.                 rNew.select();
  25.                 }
  26.             }
  27.         }
  28.     }
But thank you in advance :),
Rach
Aug 15 '08
106 19621
bonneylake
769 512MB
For the first question, you may have to change the autoComplete function. You could default to the first option to begin with.

I may have misunderstood the second question. If you meant that it appears below the field with the previous entries, then you can use 'autocomplete="off"' as an attribute for the field.
Hey Acoder,

well the first question i asked was working correctly because it does leave the field blank.Think i just got confused by something else. But i was wondering, for some reason if the drop down box is blank it will still allow the user to autofill if you click on the button an it puts undefined in all the fields an was wondering if there was a way to disable the button until they actually choose a field in the drop down box?


Well on my second question, what i am trying to do is when a user starts typing in the field it starts guessing what i am typing behind it (its in blue what it thinks i am typing) but anyway i was wondering if i could make it so it would stop guessing what i am typing behind it, but still autofill the drop down box?i don't know if its possible but just wanted to ask.

here is what i have
Expand|Select|Wrap|Line Numbers
  1. Customer Number*:<input type="text" name="custnum" id="clientID" 
  2. value="#fk_customer_number#"  ONKEYUP="autoComplete(this,this.form.customer,'value',false)" size="20"/>
  3. <cfset fk_customer_number = #fk_customer_number#>
  4. </cfoutput>
  5. <SELECT NAME="customer" id="options"
  6. onChange="this.form.custnum.value=this.options[this.selectedIndex].value;"/>
  7. <option value="" selected></option>
  8. <cfoutput query="getcustnum">
  9. <option value="#fk_custNum#"<cfif #fk_custNum# is #fk_customer_number#>selected</cfif>>#fk_custNum#</option>
  10. </cfoutput>
  11. </SELECT>
  12. <input type="button" class="custnum" name="insert" value="Insert Contact" 
  13.  onclick="getClientData();"/>
Thank you again for all the help :),
Rach
Sep 22 '08 #101
acoder
16,027 Expert Mod 8TB
In the getClientData() function, you could check for the value. If it's empty, don't make the request.

As for the guessing, this is most probably caused by the auto-complete function. If you remove the second part of the function which creates a text range and selects the text, it shouldn't guess any longer.
Sep 22 '08 #102
bonneylake
769 512MB
In the getClientData() function, you could check for the value. If it's empty, don't make the request.

As for the guessing, this is most probably caused by the auto-complete function. If you remove the second part of the function which creates a text range and selects the text, it shouldn't guess any longer.
Hey Acoder,

Got the auto-complete working correctly (yay). But i am lost on the getClientData. I can tell it already checks clientID, but not sure how to make it check that both the clientID and customer both have a value.

here is what i did try,but i had to have missed something because didn't work
Expand|Select|Wrap|Line Numbers
  1. var ajax = new sack();
  2.     var currentClientID=false;
  3.     var currentCustomer=false;
  4.     function getClientData()
  5.     {
  6.         var clientId = document.getElementById('clientID').value;
  7.         var customer = document.getElementById('customer').value;
  8.         if (clientId != "" & customer != "") {
  9.             currentClientID = clientId
  10.             currentCustomer = customer
  11.             ajax.requestFile = 'getClient.cfm?custnum='+clientId;    // Specifying which file to get
  12.             ajax.onCompletion = showClientData;    // Specify function that will be executed after file has been found
  13.             ajax.runAJAX();        // Execute AJAX function            
  14.     }}
here is what the code originally looks like.
Expand|Select|Wrap|Line Numbers
  1. var ajax = new sack();
  2.     var currentClientID=false;
  3.     function getClientData()
  4.     {
  5.         var clientId = document.getElementById('clientID').value;
  6.         if (clientId != "") {
  7.             currentClientID = clientId
  8.             ajax.requestFile = 'getClient.cfm?custnum='+clientId;    // Specifying which file to get
  9.             ajax.onCompletion = showClientData;    // Specify function that will be executed after file has been found
  10.             ajax.runAJAX();        // Execute AJAX function            
  11.     }}
Thank you,
Rach
Sep 22 '08 #103
acoder
16,027 Expert Mod 8TB
The id of the customer drop down is "options", so:
Expand|Select|Wrap|Line Numbers
  1. var clientId = document.getElementById('clientID').value;
  2. var customer = document.getElementById('options').value;
  3. if (clientId != "" && customer != "") {
Sep 22 '08 #104
bonneylake
769 512MB
Hey Acoder,

IT WORKS! THANK YOU THANK YOU!!!!

I got one last question i was hoping you could help me out with. I don't know if i need to start a new thread for this but its dealing with the same page so thought i would try asking. if i need to start a new thread for this let me know :).

But anyway i been working on trying to understand the URL method of retrieving information. I been able to get one table of information, but now i need to get 3 tables of information at the same time an i am running into trouble. Each table has a number in common with the other, each has a field that holds the number (but fields have different name). For example ticketMaster table has the field pk_ticketID which holds the number 1, serial has the field pkb_fk_ticketNo which holds the number 1, and parts has the field fk_ticketNo which holds the number 1. Right now i can get the correct table information for ticketMaster but for the serial an parts i get all the tables that are in those tables instead of just the one record needed, which in this case is the one record that holds the number 1.

Right now here is what i have
Expand|Select|Wrap|Line Numbers
  1. <!---Shows what was previously entered into table ticketmaster--->
  2. <cfquery name="ticket" datasource="CustomerSupport">
  3.         SELECT pk_ticketID,title,priority,status,
  4. cost_center,fk_customer_number,
  5. customer_company,customer_Fname,customer_Lname,
  6. customer_add1,customer_city,customer_state,
  7. customer_zip,customer_email,customer_pri_phone,
  8. customer_sec_phone,customer_notes,htpp FROM dbo.tbl_CS_ticketMaster
  9.         WHERE pk_ticketID = #URL.pk_ticketID#
  10. </cfquery>
  11.  
  12. <cfquery name="serial" datasource="CustomerSupport">
  13.         SELECT pka_serialNo,pkb_fk_ticketNo,model_no,product_type,
  14. software_hardware,resolution,resolution_date,
  15.          verification_date,rma_data,
  16. type_hardware_failure,dept_responsibility,resolution_verified_by FROM dbo.tbl_CS_serial
  17. </cfquery>
  18.  
  19. <cfquery name="parts" datasource="CustomerSupport">
  20.         SELECT pk_partID,fk_serialNo,fk_ticketNo,hc_partNo,
  21. part_returned,defective,submission
  22.          FROM dbo.tbl_CS_parts
  23. </cfquery>
  24.  
  25. <form name="page1" id="page1" action="saveticket1edit.cfm?<cfoutput query="ticket">pk_ticketID=#pk_ticketID#</cfoutput><cfoutput query="serial">&pkb_fk_ticketNo=#pkb_fk_ticketNo#</cfoutput><cfoutput query="parts">&fk_ticketNo=#fk_ticketNo#</cfoutput>"
  26. method="POST" onSubmit="return validate_form();">
  27. </form>
If you could let me know what i am doing wrong i would really appreciate it, i been looking online for days an can't find anything online that does anything i am trying to do. But again THANK YOU so much for the help :) on the autofill i really really appreciate it!!!

Thank you again for all the help :),
Rach
Sep 22 '08 #105
acoder
16,027 Expert Mod 8TB
Glad the auto-fill's now fully working.

Since this is a new problem, I would say yes, this calls for a new thread. I think this one's long enough as it is :)
Sep 22 '08 #106
bonneylake
769 512MB
Hey Acoder,

Thank you again for all the help. I opened a new thread, if you wouldn't mind checking it out i would really appreciate it :)

http://bytes.com/forum/showthread.ph...33#post3361333

Thank you so much for all the help once again,

Rach
Sep 22 '08 #107

Sign in to post your reply or Sign up for a free account.

Similar topics

2
by: John Scott | last post by:
Hi there, I have a PDF that has editable form fileds. I want to be able dynamically fill in those form fields based on values I provide to the PDF. Right now, I can create an instance of the...
1
by: mikeybe | last post by:
Making a very simple library circulation database for a school project. I have a Patron Information table(patronID, first name, last name, phone) , an item information table (bookID, book title,...
2
by: Joanne Lewis | last post by:
I am having a great deal of difficulty with a form. Basically, I would like to enter an account # and have the account #, patient first name, and patient last name automatically fill. The form...
19
by: Alex | last post by:
Hello list This question has probably already been asked, but let me ask again I have a mysql database to which I connect with my php scripts. The database contains articles. Name, Unit_Price...
1
by: kelly623 | last post by:
I have a combo box to select a client name and then it fills in the rest of their information (address, city, state, phone, etc.) Each field is bound to the table where the information is stored. ...
2
by: mxdllc | last post by:
i would like to create an admin panel for my business. because i have 5 or 6 suppliers and to order i have to lookup which supplier it is then find the url, so to make things a little easier im going...
1
by: pbrooks252 | last post by:
I am very new to Macromedia Coldfusion, I have a user registration form and would like to capture / store & for debugging purposes echo (print) the form data using a CFscript. The formís name is...
3
by: SilverLight | last post by:
I need to write a C# windows application that can open a web page, fill in the fields and click the submit button on the web page automatically. I don't want to use the web browser control and have...
1
by: Rick Owen | last post by:
Greetings, I have a form that, when submitted, calls a plsql procedure. The form has a number of fields (text, hidden, select, radio) but the particular field that is giving me problems is a...
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...
0
by: ryjfgjl | last post by:
In our work, we often need to import Excel data into databases (such as MySQL, SQL Server, Oracle) for data analysis and processing. Usually, we use database tools like Navicat or the Excel import...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: aa123db | last post by:
Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.