我正在尝试完成以下操作,从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>