2015-05-18 11 views
0

Я работаю над приложением, которое имеет 2 элемента Cfform, которые отображают результаты из таблицы DB. Я хочу обновить содержимое таблицы БД и обновить элементы cfform без обновления страницы. Как включить javascript в свой код для обработки асинхронного обновления компонентов дисплея без полного обновления страницы в браузере? data entry formКак написать функцию Javascript для обновления формы формы Coldfusion

Data windows populated by forms

ответ

0

Решение этой проблемы заключается в следующем:

  1. Изменение типа формы из флэш-памяти в 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> 

Coldfusion:

<!--- 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> 
3

Вам просто нужно сделать JSON вызовы через JQuery. Функции - $ .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 
    } 
}); 
+0

это не будет работать слишком хорошо с ColdFusion – duncan

+0

Действительно, я не заметил, отредактировал –