使用AJAX将选择列表值传递给CFC

时间:2014-09-12 12:43:35

标签: jquery ajax cfc

我正在尝试完成以下操作,从CFC填充选择列表,然后根据该选择填充第二个CFC调用的表单输入字段。

此时我可以填充选择列表,但我不确定如何在第二个AJAX请求中传递该值并将数据从CFC返回到我的输入字段。

我的Chrome调试控制台在我的第二次CFC调用发生时显示此错误:

500 The VEHICLE_NAME parameter to the getDetail function is required but was not passed in.

截至目前,我只是使用字符串" working"填充输入字段。成功。但我想传回CFC数据里程数'改为输入字段。

这是我的两个ajax调用:

<!--- Retieve list of vehicles and mileage --->
<script>
$(document).ready(function () {       
    //populate the vehicle selectlists
    $.ajax({
       url: 'cfcs/mileagedata.cfc?method=getData&returnformat=json',
       dataType: 'json',
       success: function(response){
           $.each(response.DATA, function(i, row){
            // get value in first column ie "description"
            var vehicle_name = row[0];

            // append new option to list
            $("#vehicle_name").append($('<option/>', { 
                    value: vehicle_name,
                    text : vehicle_name 
            }));

        });
        PopulateOdometers();
       },
       error: function(msg){
           console.log(msg);
       }
    })



});
</script>

<script>
function PopulateOdometers(){
    // Populate the start and stop odometer text boxes when the selectlist ajax completes successfully
    $.ajax({
        url:'cfcs/mileagedata.cfc?method=getDetail&returnformat=json',
        data: { vehicle_name: $("#vehicle_name>option:selected").attr("Value") },
        success: function(response) {
            $("#start_odometer").val( response );
            $("#end_odometer").val( response );
            }
      });
  }
</script>

这是我的CFC:

<!---Service Vehicle Slect Box --->
<cffunction name="getData" access="remote" returntype="query">

<!--- Function to get data from datasource --->
<!---Get Service Vehicles --->
<cfquery name="data" datasource="#datasource#">
select vehicle_name
from vehicles
where active = '1'
</cfquery>


<!--- Return results --->
<cfreturn data>
</cffunction>

<cffunction name="getDetail" access="remote" returnType="string">
<cfargument name="vehicle_name" type="any" required="true">

<!--- localize function variables --->
<cfset var dataDetail = "">

<cfquery name="dataDetail" datasource="#datasource#">
    SELECT mileage
    FROM   vehicles
    <!--- adjust cfsqltype if needed --->
    WHERE vehicle_name = <cfqueryparam value="#ARGUMENTS.vehicle_name#" cfsqltype="cf_sql_varchar">
</cfquery>

<cfreturn dataDetail.mileage>
</cffunction>

这是我的表格:

<form name="addmileage" id="addmileage" method="post">
         <br />
             <table class="mainTable">
                  <tr>
                    <td><label>Service Vehicle:</label></td>
                    <td>
                    <select name="vehicle_name" id="vehicle_name" onchange="PopulateOdometers();">
                    <option>Select a vehicle</option>
                    </select>                    
                    </td>
                  </tr>
                  <tr>
                    <td><label>Date:</label></td>
                    <td><input class="calendarInputBox" name="vdate" id="vdate" type="text" required="yes" /></td>
                  </tr>
                  <tr>
                    <td>
                      <label>Origin:</label></td>
                    <td><input required="yes" name="origin" type="text" /></td>
                  </tr>
                  <tr>
                    <td><label>Destination:</label></td>
                    <td><input required="yes" name="destination" type="text" /></td>
                  </tr>
                  <tr>
                    <td><label>Start Odometer:</label></td>
                    <td><input id="start_odometer"  name="start_odometer" type="text"  onBlur="stopMaterialCalc();" onFocus="startOdometerCalc();"/></td>
                  </tr>
                  <tr>
                    <td><label>End Odometer:</label></td>
                    <td><input id="end_odometer" name="end_odometer" type="text"  onBlur="stopMaterialCalc();" onFocus="startOdometerCalc();" /></td>
                  </tr>
                  <tr>
                    <td><label >Total mileage:</label></td>
                    <td><input id="total_mileage" name="total_mileage" type="text" /></td>
                  </tr>
                  <tr>
                    <td><label >Expenses:</label></td>
                    <td><input value="0.00" name="expenses" type="text" /></td>
                  </tr>
                  <tr>
                    <td colspan="2">

                   <input type="submit" id="submit" name="submit" value="Add Trip"><div class="response" id="addTripMessage"></div>
                    <br />
                   </td>
                  </tr>
            </table>
</form>

0 个答案:

没有答案