如何编写 Javascript 函数来更新 Coldfusion 表单显示

How to write a Javascript function to update a Coldfusion form display

我正在开发一个应用程序,它有 2 个 Cfform 元素,显示来自 DB table 的结果。我想更新 DB table 的内容,并在不刷新页面的情况下更新 cfform 元素。我如何将 javascript 合并到我的代码中以在浏览器中不刷新整个页面的情况下处理异步刷新显示组件?

您只需通过 JQuery 拨打 JSON 电话。函数是 $.ajax、$.post 或 $.get.

有个whole example of AJAX with Coldfusion HERE

$.ajax({
  dataType: "json",
  url: url,
  data: data, // This is the request data
  done: function(json) {
    console.log(json);
    // Work with data
  }
}); 

解决方法如下:

  1. 将表单类型从 Flash 更改为 HTML。消除 CFformlayout 标签,因为它们只会造成不必要的麻烦。

  2. 以下代码提供了一个有效的 coldfusion 函数和 javascript 调用:

AJAX:

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script language="javascript">

    $(document).ready(function() {
        $("#createReport").click(function(f) {
            var getReportName = $("input#reportName").val();
            var getReportPath = $("input#reportPath").val();
            var getReportDesc = $("input#reportDescrip").val();
            //var getCategory   = $("input#categoryBox").val();


            $.ajax({
                type:"POST",
                url: "http://10.11.2.60/testFolder/bidirectionalreporting/codetest/components/coldfusionFunction.cfc?method=testFunc&returnformat=json",
                dataType: "JSON",
                data:{ 
                        reportName: getReportName,
                        reportPath: getReportPath,
                        reportDescrip: getReportDesc
                        //categoryBox: getCategory

                },
                success: function(result){
                    alert("You successfully added a new report to the system") } 
    });
        });
    });     
</script>

冷熔:

 <!--- CF AJAX function to create new report in DB--->
 <cffunction name="testFunc"  access="remote" description="tests the AJAX functionality and query">     
    <!--- Function takes in variables from CF page and AJAX call --->
    <cfargument name="mathVariable" default="8978" type="any">                                             

    <!--- This is just a test argument to verify ajax works before adding new fields--->
    <cfargument name="reportName" default="" type="any">                                                   
    <!--- This argument maps to the like named form field and is passed through AJAX call--->               
    <cfargument name="reportPath" default="" type="any">                                                   
    <!--- This argument maps to the like named form field and is passed through AJAX call--->
    <cfargument name="reportDescrip"  default="" type="any" >                                              
    <!--- This argument maps to the like named form field and is passed through AJAX call--->
    <cfargument name="categoryBox" default="Vendor Management" type="any">
    <!--- This argument maps to the like named form field and is passed through AJAX call--->

    <cfquery name="qryTest" datasource="First_Title_Main_Dev">                                                  <!--- Query creates a new report in the master report list table--->
     INSERT INTO Report_Master_List (Report_Name, URL, Report_Desc, Category)

     VALUES (
        <cfqueryparam cfsqltype="cf_sql_varchar" value="#arguments.reportName#">,                   
        <!--- report name form field references Report_Name column--->
        <cfqueryparam cfsqltype="cf_sql_varchar" value="#arguments.reportPath#">,                   
        <!--- report path form field references ReportPath column--->
        <cfqueryparam cfsqltype="cf_sql_varchar" value="#arguments.reportDescrip#">,                
        <!--- report descrip form field references ReportDescrip column --->
        <cfqueryparam cfsqltype="cf_sql_varchar" value="#arguments.categoryBox#">
     )                  
     <!--- categoryBox form field references Category column --->
    </cfquery>

    <cfquery name="updateReportList" datasource="First_Title_Main_Dev">
    SELECT rid, Report_Name                                                                                   <!---Get updated Report Name--->
    FROM Report_Master_List                                                                           <!---Table referenced is Report_Master_List--->
    </cfquery>
    <cfreturn updateReportList>
</cffunction>