Skip to main content
Participant
April 13, 2006
Answered

CF variable in Javascript?

  • April 13, 2006
  • 5 replies
  • 672 views
I have a series of forms for a shopping cart checkout. The way the client has it setup, the user fills out a form with their name, address, etc and then goes to a page to select payment method. If credit card is selected, a form with standard CC number, exp. date comes up. Also on this page, the user fills out the billing address. There is a check box for if the billing address is the same the the user's address. I need for the billing form to be auto-filled if the checkbox is selected.

I know how to do this if the 2 forms are on the same screen, but in this case the first form is filled out previously. The info from the first form is in a table, so I can query the database to get the address information. But how do I get these ColdFusion variables into the Javascript? JS is not my strong suit, but here is a script I've used before:

<script language="JavaScript">
function useBillInfo(form)
{
var idx;
{
form.ShipTo_Name_First.value= form.BillTo_Name_First.value;
form.ShipTo_Name_Last.value = form.BillTo_Name_Last.value;
form.ShipTo_Address.value = form.BillTo_Address.value;
form.ShipTo_City.value = form.BillTo_City.value;
}
}
</script>

and then use this in the form as the checkbox code:

<input onClick="useBillInfo(this.form)" type="checkbox" value="1" name="ship_usebill" >

So what I really need is a clue on how to assign the "form.ShipTo_Name_First.value" in the Javascript to be equal to a CF variable pulled from a CFquery.

Hope this makes sense, and thanks in advance for your help!
A.L.


This topic has been closed for replies.
Correct answer
Well then the best way to do is first run the query

<cfquery name="Qname" datasource="">
select * from table
</cfquery>

<cfoutput>
<script>
function useBillInfo(form)
{
var idx;
{
document.form.ShipTo_Name_First.value= '#Qname.A#';
document.form.ShipTo_Name_Last.value = '#Qname.B#';
document.form.ShipTo_Address.value = '#Qname.C#';
document.form.ShipTo_City.value = '#Qname.D#';
}
}

</script>
<cfoutput>

<input onClick="useBillInfo(this.form)" type="checkbox" value="1" name="ship_usebill" >

5 replies

Participant
April 17, 2006
Thanks everyone for your help -- and not to worry, the CC number is not part of this script. This will be passed to the server with versign encryption.
Inspiring
April 13, 2006
I'm a little confused. Is the second form a pop-up window to the first form? If that is the case, simply change your form so that you can access the original form.

For example,

function useBillInfo(form)
{
var idx;
{
form.ShipTo_Name_First.value= eval('opener.document.form.BillTo_Name_First.value');
form.ShipTo_Name_Last.value = eval('opener.document.form.BillTo_Name_Last.value');
form.ShipTo_Address.value = eval('opener.document.form.BillTo_Address.value');
form.ShipTo_City.value = eval('opener.document.form.BillTo_City.value');
}
}
</script>

However, if the second page is not a pop-up, you will need to retrieve the information and then put it in the javascript as constants:

<cfoutput>
function useBillInfo(form)
{
var idx;
{
form.ShipTo_Name_First.value= "#BillTo_Name_First#";
form.ShipTo_Name_Last.value = "#BillTo_Name_Last#";
form.ShipTo_Address.value = #BillTo_Address#";
form.ShipTo_City.value = #BillTo_City#";
}
}
</script>
</cfoutput>

Either way, you should not have a problem with making this work.

I hope that help,
Correct answer
April 13, 2006
Well then the best way to do is first run the query

<cfquery name="Qname" datasource="">
select * from table
</cfquery>

<cfoutput>
<script>
function useBillInfo(form)
{
var idx;
{
document.form.ShipTo_Name_First.value= '#Qname.A#';
document.form.ShipTo_Name_Last.value = '#Qname.B#';
document.form.ShipTo_Address.value = '#Qname.C#';
document.form.ShipTo_City.value = '#Qname.D#';
}
}

</script>
<cfoutput>

<input onClick="useBillInfo(this.form)" type="checkbox" value="1" name="ship_usebill" >
Participant
April 14, 2006
Excellent -- thanks for your help. I've never put CF variables ito a javascript before, so wasn't sure how or if it could be done.
Legend
April 14, 2006
Just make sure you don't do the same with credit card data (card number, expiration date, CVV2 codes, etc.) -- doing so would store unencrypted card information in the temporary files on the customers computer.

None of the coding examples previously posted do this but your original posting did mentions credit card so I thought I would chime in.