javascript to manipulate coldfusion variables?

[theotrain]

OK ive got a form with several groups of radio buttons. clicking different buttons should dynamically change a figure on the page.

so lets imagine there was a radio button labeled "i want cheese on my whopper" and when you click it it adds 20 cents to your total. (checking "i dont want cheese" removes the 20 cents of course)

this can only be done with javascript, right? the numbers that change are going to be pulled from a query, so the javascript has to manipulate coldfusion variables. thats the first place i get lost. if i have a variable #getPrices.cheese# how do i get javascript to "see" that?

i (think i) know the radio button will need to call a javascript function i.e. onclick="computePrice();"...after that i dont really have a clue becasue my javascript is weaky weak weak.

any heroes out there?

 

[LyndonOHRC]

First of all coldfusion pre-processes your template (.cfm file) and sends a document to the client browser. This document has no coldfusion code it. That was all ran to create the, browser compliant, document that is sent. See "View Source" from your browser to see the document that the CF server sent to the client.

Now the browser has the document and the server has no more interaction with the document, unless you are using some kind of AJAX strategy that is.

What you want to do is populate document elements (like form inputs and such) with default values in your CF template.

Then use javascript to manipulate the DOM when/if the client takes cretin actions within it.

Example:

<select id="cheese">
<option value=#qryHamburgerOptions.PriceForNoCheese# selected>No Cheese</option>
<option value=#qryHamburgerOptions.PriceForSwissCheese#>Add Swiss Cheese</option>
</select>

Now the DOM has a form object and a select object. If you have elements on the document you want to update based on the user changing to cheese option, set an onClick behavior for the cheese object to update an element that shows the configured hamburger price on screen. I.E. Using javascript you could update the innerHTML property of a table cell with the value property of the select object. See the javascript forum for help there.

When the user submits the form your action page can reference form.cheese for the cheese price when creating an invoice.

Hopefully the gives you a simple overview of the document management process using HTML/CF/javascript.


Lyndon

---People Remember about 10% of what you say ---They never forget how you made them feel. Covey

 

[theotrain]

thanks for the lowdown. in my case i didnt want to actually make the value of the buttons the numerical value of the price difference, so i passed the values to javascript as arguments instead.

i had the javascript change the value of a form element called "total" which i can grab in my action page instead of using the value of the button.

its a weird system, because one set of buttons affects others. but i did manage to get it working.