将所有表单范围异步发送到 CFC

发布于 2024-11-24 08:43:20 字数 1024 浏览 1 评论 0原文

目前正在尝试解决 ColdFusion 中的异步提交问题。我总是遇到这个问题。我有一个表单,想要提交给远程 CFC 并获得某种响应。 (最终此表单将具有类似草案的功能...)我知道如何设置每个部分:表单和 CFC。我的问题是连接它们!关于此有一些类似的帖子,但没有一个提供足够的信息......至少对我来说。

表格:

<cfform action = "/cfc/request.cfc?method=updateRequest"  method = "post" name = "requestForm" id = "requestForm" enctype="multipart/form-data">
    ........<!-- Fields redacted -->

</cfform>

CFC 方法(这只是一个测试):

<cffunction name="updateRequest" access="remote" returntype="numeric">
        <cfargument name="form" type="struct" required="yes">
        <cfset var status = 0>

         <cfreturn status>
</cffunction>

注意:我的 CFC 功能设置为远程等等等等...

我这里有我的表格,应该将其发布到 cfc,但它实际上去 到 cfc 页面。我不想要这个。我对在 ColdFusion 中使用 ajax 的尝试感到非常沮丧。我准备只使用 jQuery 来提交它。我可以用 jQuery 做到这一点...但是我不知道如何将字段放入结构中。 (这个表单将会很大...)我想了解如何在 ColdFusion 或 jQuery 中将表单信息作为结构发送。我希望能够保留表单字段名称。

即使有人能给我指出正确的方向……那就太好了。一段时间以来,我一直试图找到有关此问题的好教程,但也未能成功。

Currently working on trying to figure out asynchronous submission in ColdFusion. I always have trouble with this. I have a form that I want to submit to a remote CFC and get some sort of response back. (Eventually this form is going to have a draft like function...) I know how to set up each part: the form and the CFC. My problem is connecting them!!! There was some similar post about this, but none offer sufficient information....for me at least.

Form:

<cfform action = "/cfc/request.cfc?method=updateRequest"  method = "post" name = "requestForm" id = "requestForm" enctype="multipart/form-data">
    ........<!-- Fields redacted -->

</cfform>

CFC Method (this was just a test):

<cffunction name="updateRequest" access="remote" returntype="numeric">
        <cfargument name="form" type="struct" required="yes">
        <cfset var status = 0>

         <cfreturn status>
</cffunction>

Note: my CFC function is set to remote etc. etc. etc...

I have my form here which should post to the cfc, however it actually goes to the cfc page. I don't want this. I've grown so frustrated with trying to use ajax with ColdFusion. I'm ready to resort to just using jQuery to submit it. I can do it jQuery...however I don't know how to get the fields into a struct. (This form is going to be large...) I'd like to see how to send form information as a struct in either ColdFusion or jQuery. I want to be able to retain the form field names.

Even if someone could point me in the right direction...that would be great. I've tried to find a GOOD tutorial on this for sometime and have not been able too.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

菩提树下叶撕阳。 2024-12-01 08:43:24

我认为如果您想包含文件字段及其内容,则上传所有内容时可能会遇到问题。浏览器的安全性不允许您读取该文件(您需要这样做才能通过 ajax 请求上传其内容)。正如已经提到的,使用序列化将获得表单的其他内容,您可以在服务器上对其进行解码。
如果您确实需要文件的内容,您可能需要考虑将表单提交到隐藏的 iFrame,这不会导致页面重新加载,但应该发送文件:

<form action="saveCode.cfc?method=safeDraft" method="post" enctype="multipart/form-data" target="upframe">
Say Something: <input type="text" name="foo"><br>
Add a File: <input type="file" name="myfile"><br>
<input type="submit">

我还强烈建议使用 Fiddler (fiddler2.com) 来观察上传的内容并确保正确解码上传的内容

编辑:Stack Overflow 隐藏了我的 iframe 标签在上面的例子中。我还在 Mac 上的 Chrome 和 FireFox 中测试了该示例,它似乎工作正常。

I think you may have a problem uploading everything if you want to include the file field and it's contents. Security in browsers won't let you read the file (which you'd need to do in order to upload it's contents through an ajax request). As has been mentioned, using serialize will get you the other contents of the form, which you can decode at the server.
if you really need the contents of the file, you may need to look at submitting the form to a hidden iFrame which won't cause the page to reload, but ought to send over the file:

<form action="saveCode.cfc?method=safeDraft" method="post" enctype="multipart/form-data" target="upframe">
Say Something: <input type="text" name="foo"><br>
Add a File: <input type="file" name="myfile"><br>
<input type="submit">

<iframe src="initial.html" id="upframe" name="upframe"></iframe>

I'd also strongly recommend using Fiddler (fiddler2.com) to watch what's getting uploaded and to make sure you're decoding what's uploaded correctly

Edit: Stack Overflow hid my iframe tag in the example above. I've also tested the example in Chrome and FireFox on a Mac and it seems to work ok.

时光暖心i 2024-12-01 08:43:24

我认为你正在寻找的是标签和类似的东西:

<cfajaxproxy bind="cfc:mycfc.myfunction(arg1={myform:myfield1},arg2={myform:myfield2})" />

你实际上并没有像你所做的那样在url中指定一个动作,而是通过ajax代理调用它。

我认为这就是您正在尝试的,可能是错误的,请告诉我:)

I think what you're looking for is the tag and something like this :

<cfajaxproxy bind="cfc:mycfc.myfunction(arg1={myform:myfield1},arg2={myform:myfield2})" />

You don't actually specify an action in the url as you've done, you call it through the ajax proxy.

I think this is what you're attempting, could be wrong, let me know :)

从﹋此江山别 2024-12-01 08:43:23

如果您想将表单控件作为结构传递,我会首先尝试将表单元素序列化为 json 字符串,然后将该字符串传递给您的 Web 服务。然后,您可以在 Web 服务中使用 DeserializeJSON() 将其转换回结构。下面是一些代码,应该可以让您接近这一点:

<script>
/* function prototype code modified from here: http://api.jquery.com/serializeArray/#comment-130159436 */
(function( $ ){
$.fn.serializeJSON=function() {
var json = [];
jQuery.map($(this).serializeArray(), function(n, i){
json.push('"' + escape(n['name']) + '":"' + escape(n['value']) + '"');
});
return '{' + json.join(',') + '}';
};
})( jQuery );

// make the request to your webservice
$.post('myComponent.cfc?method=updateRequest', { formJSON: $("#requestForm").serializeJSON()}, function () { /* handle response here. */ })
</script>

然后在您的 CFC 中,更改参数,如下所示:

<cffunction name="updateRequest" access="remote" returntype="numeric">
    <cfargument name="formJSON" type="string" required="yes">
    <cfset var formStruct = DeserializeJSON(arguments.formJSON)>
    <cfset var status = 0>

     <cfreturn status>
</cffunction>

If you want to pass the form controls as a structure, I would first try serializing the form elements as a json string, then pass that string to your webservice. From your webservice, you could then use DeserializeJSON() to convert it back to a structure. Here's some code that should get you close to this:

<script>
/* function prototype code modified from here: http://api.jquery.com/serializeArray/#comment-130159436 */
(function( $ ){
$.fn.serializeJSON=function() {
var json = [];
jQuery.map($(this).serializeArray(), function(n, i){
json.push('"' + escape(n['name']) + '":"' + escape(n['value']) + '"');
});
return '{' + json.join(',') + '}';
};
})( jQuery );

// make the request to your webservice
$.post('myComponent.cfc?method=updateRequest', { formJSON: $("#requestForm").serializeJSON()}, function () { /* handle response here. */ })
</script>

Then in your CFC, change the argument like so:

<cffunction name="updateRequest" access="remote" returntype="numeric">
    <cfargument name="formJSON" type="string" required="yes">
    <cfset var formStruct = DeserializeJSON(arguments.formJSON)>
    <cfset var status = 0>

     <cfreturn status>
</cffunction>
醉南桥 2024-12-01 08:43:23

使用ColdFusion.Ajax.submitForm函数

<html> 
<head> 
<!--- The cfajaximport tag is required for the submitForm function to work 
            because the page does not have any Ajax-based tags. ---> 
<cfajaximport> 

<script> 
    function submitForm() { 
        ColdFusion.Ajax.submitForm('myform', 'asyncFormHandler.cfm', callback, 
            errorHandler); 
    } 

    function callback(text) 
    { 
        alert("Callback: " + text); 
    } 

    function errorHandler(code, msg) 
    { 
        alert("Error!!! " + code + ": " + msg); 
    } 
</script> 

</head> 
<body> 

<cfform name="myform"> 
    <cfinput name="mytext1"><br /> 
    <cfinput name="mytext2"> 
</cfform> 

<a href="javascript:submitForm()">Submit form</a> 

http://help.adobe.com/en_US/ColdFusion/9.0/Developing/WSc3ff6d0ea77859461172e0811cbec22c24-7a01.html#WS71B55A73-D08F-47c7-B062-0543793B83A5

Use ColdFusion.Ajax.submitForm function

<html> 
<head> 
<!--- The cfajaximport tag is required for the submitForm function to work 
            because the page does not have any Ajax-based tags. ---> 
<cfajaximport> 

<script> 
    function submitForm() { 
        ColdFusion.Ajax.submitForm('myform', 'asyncFormHandler.cfm', callback, 
            errorHandler); 
    } 

    function callback(text) 
    { 
        alert("Callback: " + text); 
    } 

    function errorHandler(code, msg) 
    { 
        alert("Error!!! " + code + ": " + msg); 
    } 
</script> 

</head> 
<body> 

<cfform name="myform"> 
    <cfinput name="mytext1"><br /> 
    <cfinput name="mytext2"> 
</cfform> 

<a href="javascript:submitForm()">Submit form</a> 

http://help.adobe.com/en_US/ColdFusion/9.0/Developing/WSc3ff6d0ea77859461172e0811cbec22c24-7a01.html#WS71B55A73-D08F-47c7-B062-0543793B83A5

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文