1

I'm having problems visualizing the solution that I need here. I have a select menu on the site that I'm working on and the client would like to be able to select an option called "Create New Origin", which would then have a JS window pop up with a blank field for the user to type in that new origin.

Upon submitting this form the database would be updated and the select menu would now feature this item without an entire refresh of the page.

The database side of things is all set up and ready to go, as is 99% of the Coldfusion.

Here's a snippet of the form field in question:

<p class="_30NP" align="right"> <label>Origin&nbsp;</label> </p> <p class="_20NP"> <cfselect name="Origin" id="Origin" query="Origin" display="description" value="code" required="yes"> <option value="new">New Origin</option> </cfselect> </p> 

Here's the CFQUERY:

<CFQUERY DBTYPE="Query" NAME="Origin"> SELECT Code, [Description] FROM ZCODES WHERE CODE = 0 UNION ALL SELECT Code, [Description] FROM ZCODES WHERE FieldName = 'Origin' ORDER BY 1 </CFQUERY> 

This is a very simple question with probably a very simple answer, I just have little exposure to AJAX.

How do I submit a form (pop up window) and refresh the select list without completely refreshing the page?

2
  • This is a very simple question, I actually don't see a question here. Are you asking where to start learning ajax with a javascript library like jquery (recommended) or are you asking how to do this with cfselect and binding? Commented Mar 4, 2013 at 18:52
  • sorry. How do I submit a form (pop up window) and refresh the select list without completely refreshing the page? Commented Mar 4, 2013 at 18:58

2 Answers 2

1

I would use a javascript library like jQuery to handle your ajax.

Once the button is clicked use $.get(), $.post(), or $.ajax() to communicate with the server. Each will provide a response. The response type is up to you. You could return JSON and parse it out, or you could return straight HTML. I might simply return html to be quick and easy.

<cfoutput query = "..."> <option value = "...">...</option> </cfoutput> 

Once you have the result, use $.html() to update the select's options.

Sign up to request clarification or add additional context in comments.

Comments

0

Michael, I personally dislike a completely jQuery ajax solution. I really like CFAJAXPROXY. I hear it has downsides, but I haven't found any.

Your question is very similar to another question on a stackexchange.com site. I think you can find some good info here.

https://softwareengineering.stackexchange.com/questions/133759/where-can-i-find-a-simple-jquery-ajax-coldfusion-tutorial

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.