阿贾克斯和Coldfusion:对数据库执行更新并反映更改而无需重新加载 [英] AJAX & Coldfusion: Performing an update to database and reflecting changes without reload

问题描述

我在可视化此处需要的解决方案时遇到问题.我正在处理的网站上有一个选择菜单，客户希望能够选择一个名为创建新源"的选项，然后会弹出一个带有空白字段的 JS 窗口供用户使用输入新的来源.

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.

数据库方面的一切都已设置好并准备就绪，Coldfusion 的 99% 也是如此.

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>

这是 CFQUERY:

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>

这是一个非常简单的问题，答案可能非常简单，我只是很少接触 AJAX.

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?

推荐答案

我会使用像 jQuery 这样的 javascript 库来处理你的 ajax.

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

单击按钮后，使用 $.get(), $.post() 或 $.ajax() 与服务器通信.每个人都会做出回应.响应类型由您决定.您可以返回 JSON 并将其解析出来，也可以直接返回 HTML.我可能会简单地返回 html 以快速简便.

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>

获得结果后，使用 $.html() 更新 select's 选项.

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

这篇关于阿贾克斯和Coldfusion:对数据库执行更新并反映更改而无需重新加载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！