0
147
ViewsAjax y Laravel 8: seleccione el término + el evento de cambio = muestre el costo en el número de tipo de entrada
Estoy tratando de cambiar dinámicamente <input type="number" name="SLACost" readonly> según la opción <select name="SLATerm">
Una tabla (en DB) que contiene:
- SLATérminos.
- Costo SLAC.
- SLADeducción
que debe obtenerse en el formulario "Agregar nueva factura de KPI".
Creé una función en el controlador para obtener los datos como json:
/** ** KPI API **/ public function fetchSLA() { $kpiTerms = KPITerms::all(); return response()->json([ 'SLATermData' => $kpiTerms, // SLATermData is the name that will be used in Ajax. ]); } creó una url para que ajax busque en web.php como Route::get('kpi/fetch/sla', 'fetchSLA')->name('kpi.fetchSLA'); // The API for fetching SLA as json
Luego siguió adelante y creó la solicitud ajax GET
function fetchSLA() { $.ajax({ type: 'GET', url: "/management/kpi/fetch/sla", dataType: 'json', success: function (response) { // console.log(response.SLATermData); $("select[name='SLATerm']").change(function() { $("input[name='SLACost']").val(response.SLATermData); }); } }); } Obviamente, SLATermData obtendrá todos los datos como json y los imprimirá en la entrada de SLACost, se muestra como [onject object object]
Traté de hacer esto:
$("select[name='SLATerm']").change(function() { $("input[name='SLACost']").val(response.SLATermData.SLACost); }); Pensé que agregar SLACost después de la response.SLATermData . SLATermData haría el truco.
¿Qué falta aquí?
1 answers
Answer question0
Así que hice una solicitud ajax tanto para SLATerm como para SLACost y revisé los datos solicitados. Luego hice una if statement dentro del ciclo para cambiar el SLACost basado en el SLATerm seleccionado.
function fetchSLA() { $.ajax({ type: 'GET', url: "/management/kpi/fetch/sla", dataType: 'json', success: function (response) { $.each(response.SLATermData, function (key, value) { $("select[name='SLATerm']").change(function() { if ( $("select[name='SLATerm']").val() == value.SLATerm ) { $("input[name='SLACost']").val(value.SLACost); } }); }); } }); }Y aquí está el controlador Laravel para la API:
/** ** KPI API **/ public function fetchSLA() { $kpiTerms = KPITerms::get(['SLATerm' => 'SLATerm', 'SLACost' => 'SLACost']); return response()->json([ 'SLATermData' => $kpiTerms, // SLATermData is the name that will be used in Ajax. ]); }Ahora que lo tengo funcionando, estoy tratando de descubrir cómo limpiar el código.
Como CBroe mencionó en los comentarios:
deberías cambiar tu API, solicitando todos los datos una y otra vez
Lo que estoy tratando de hacer.