基于两个ajax请求计算字段

Question

我正试图在Django中开发一个web应用程序。我在HTML模板中有两个ajax请求，它们运行良好，但当我尝试计算一个字段并将其放在另一个字段(#minherente(上时，这会使用以前的值来计算字段，但不会使用两个ajax中获得的值。我会感谢你的帮助。

$("#id_Falla").change(function () {
var url = $("#MatrizForm").attr("data-fi-url"); 
var FallaId = $("#id_Falla").val();  
var url1 = $("#MatrizForm").attr("data-ii-url"); 
$.ajax({                     
url: url,                  
data: {
'Falla': FallaId      
},
success: function (data) {   
$("#finherente").val(data);
}
});
$.ajax({                      
url: url1,                 
data: {
'Falla': FallaId      
},
success: function (data1) {  
$("#iinherente").val(data1);  
}
});
var frecuencia = $('#finherente').val();
var impacto = $('#iinherente').val();
$('#minherente').val(frecuencia*impacto);
});

任何帮助都将不胜感激感谢

Answer 1

由于ajax请求是异步的，因此不能依赖于回调之外解析的数据。只有在成功回调内部，才能确保数据得到解析。

你可以通过嵌套一个又一个请求，只有当两者都解决了，你才能访问数据：

$("#id_Falla").change(function () {
var url = $("#MatrizForm").attr("data-fi-url");
var FallaId = $("#id_Falla").val();
var url1 = $("#MatrizForm").attr("data-ii-url");
$.ajax({
url: url,
data: {
'Falla': FallaId
},
success: function (frecuencia) {
$.ajax({
url: url1,
data: {
'Falla': FallaId
},
success: function (impacto) {
$("#finherente").val(frecuencia);
$("#iinherente").val(impacto);  
$('#minherente').val(frecuencia * impacto);
}
});
}
});
});

如果你想同时处理这两个请求，你可以使用Promise.all，因为jQuery可以使用开箱即用的Promise：

$("#id_Falla").change(function () {
var url = $("#MatrizForm").attr("data-fi-url");
var FallaId = $("#id_Falla").val();
var url1 = $("#MatrizForm").attr("data-ii-url");
Promise.all([
$.ajax({
url: url,
data: {
'Falla': FallaId
},
}),
$.ajax({
url: url1,
data: {
'Falla': FallaId
},
}),
]).then(([frecuencia, impacto]) => {
$("#finherente").val(frecuencia);
$("#iinherente").val(impacto);  
$('#minherente').val(frecuencia * impacto);
});
});

或者，考虑使用fetch而不是jQuery的$.ajax。