Tengo la siguiente tabla que muestra el listado de lo que hay en la tabla CONTROL, el campo ESTADO se muestra como una lista despegable con la descripcion de los estatus que hay en la tabla ESTADO, tengo en el select el value 0 para que por Default tenga seleccionado el estatus actual que esta en la tabla CONTROL, y lo que quiero es que al seleccionar cualquier estatus se actualice en la base de datos
<button type="submit" class="btn btn-primary" (click)="guardar()">Guardar</button>
<table class="table table-striped">
<thead>
<tr>
<th scope="col">ID</th>
<th scope="col">ESTADO</th>
<th scope="col">COMENTARIO</th>
<th scope="col">HORA INICIO</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let contr of control">
<td>{{contr.id}}</td>
<td>
<select class="select-css">
<option value="0">{{contr.cveEstado}}</option>
<option *ngFor="let estatus of estadoModel" [value]="estatus.cveEstado">
{{estatus.descripcionEstado}}
</option>
</select>
</td>
<td>{{contr.comentario}</td>
<td>{{contr.horaInicio}}</td>
</tr>
</tbody>
</table>
Tengo lo siguiente en mi componente.ts
control: Control[] = [];
controlModel: Control = new Control();
estadoModel: Estatus[] = [];
constructor(private controlService: ControlService) { }
ngOnInit(): void {
this.obtenerListaControl();
this.obtenerListaEstado();
}
private obtenerListaControl(){
this.controlService.obtenerControl().subscribe(response => {
this.control = response.data;
});
}
private obtenerListaEstado(){
this.controlService.obtenerEstatus().subscribe(resp => {
this.estadoModel = resp.data;
});
}
guardar(){
this.controlService.updateEstado(this.controlModel).subscribe(data=>{
this.controlModel=data;
})
}
El método obtenerListaControl() es para listar lo que hay en la tabla CONTROL, el método obtenerListaEstado() es para listar la descripcion de los Estados, ya que en la tabla CONTROL solo trae la clave del estado y no la descripcion y el método guardar() que es para que realice la actualizacion en la BD y manda a llamar al servicio con el método updateEstatus()
en el service.ts
updateEstatus(control: Control){
return this.httpClient.put<Control>(this.baseUrl+"/"+control.id,control);
}
en mi backend tengo los siguientes querys, los que uso para mostrar la info. de la tabla CONTROL y de la tabla ESTADO
@Query(value = "SELECT C.ID, EST.DESCRIPCION AS CLAVE_ESTADO, C.COMENTARIO, C.HORA_INICIAL
FROM CONTROL C INNER JOIN ESTADO EST ON C.CLAVE_ESTADO= EST.CLAVE_ESTADO", nativeQuery =
true)
List<ControlEntity> consulta();
@Query(value = "SELECT EST.CLAVE_ESTADO, EST.DESCRIPCION FROM ESTADO EST", nativeQuery = true)
List<EstadoEntity> findEstado();
y estas son las tablas
@Entity
@Table(name= "CONTROL")
public class ControlEntity{
@Id
@Column(name = "ID")
private Integer id;
@Column(name = "CLAVE_ESTADO")
private String claveEstado;
@Column(name = "COMENTARIO")
private String comentario;
@Column(name = "HORA_INICIAL")
private Date horaInicial;
}
@Entity
@Table(name= "ESTADO")
public class EstadoEntity{
@Id
@Column(name = "CLAVE_ESTADO")
private String claveEstado;
@Column(name = "DESCRIPCION")
private String descripcionEstado;
}
mi método en el Controller para la actualización es el siguiente
@PutMapping("/{id}")
public ControlEntity actualizar(@RequestBody ControlEntity control,
@PathVariable("id") Integer id) {
control.setId(id);
return controlService.actualizar(control);
}
y al querer actualizar un estado seleccionado, me manda lo siguiente:
Resolved [org.springframework.web.method.annotation.MethodArgumentTypeMismatchException: Failed to convert value of type 'java.lang.String' to required type 'java.lang.Integer'; nested exception is java.lang.NumberFormatException: For input string: "undefined"]
No se que estoy haciendo mal, lo que debo de actualizar en la tabla CONTROL es la claveEstado, como puedo actualizar corrctamente el registro?
(change)
en elselect
que estás usando para modificar los valores, change se activa cuando el usuario cambia un valor y se sale del elemento. Necesitarías algo así como(change)=“cambios(valorCambiado)”
, no recuerdo bien pero creo que como se dispara cuando el usuario hace algo entonces tendrías que mandar el valor del evento.