Hola, buenos días. quisiera saber cómo puedo obtener el elemento rowIndex fuera del bucle
Código: html5
Acualmente la función onclick está dentro de cada input check para poder obtener la posición rowIndex y de esta forma obtener el id para el update.
Otro problema que tengo es que dentro de este bucle tampoco puedo obtener el valor del estado del select.
Código: java
La funcionalidad sería esta:
1.- Seleccionar todos los elementos
2.- Seleccionar el nuevo estado
3.- Guardar el nuevo estado para todos los elementos seleccionados
Mi duda es cómo obtener el row index fuera del bucle (let-item let-rowIndex="rowIndex") y/o cómo obtener el valor del select (valuestateall)
fuera del bucle, el llamado está dentro del input check dentro del bucle. Le puse por defecto 3, ya que tampoco obtiene el value (<input type="checkbox" ng-true-value="1" ng-false-value="0" class="form-check-input" id="check_{{rowIndex}}" name="check_{{rowIndex}}" [checked]="isSelected"
(click)="updatestate(item, rowIndex, 3)">)
<form class="forms-custom" novalidate="novalidate" [formGroup]="formstate" (ngSubmit)="onSubmit2(formstate.value)">
<div class="card shadow mb-4" >
<div class="card-header py-3">
<h6 class="m-0 font-weight-bold text-primary">Listado</h6>
</div>
<div class="col-md-12 d-flex flex-row-reverse align-items-baseline mt-3">
<div class="col-md-1_5">
<div class="text-left">
<button
(click)="valuestateall == 1 || valuestateall == 2 || valuestateall == 3 ? updatestate(item, rowIndex, valuestateall) : false"
class="btn btn-primary btn"
[disabled]="!(!formstate.valid || !preloaderStatus)">Guardar <i
class="fa fa-save"
*ngIf="!preloaderStatus"></i>
<i *ngIf="preloaderStatus" class="fa fa-cog fa-1x fa-spin"
aria-hidden="true"
></i>
</button>
</div>
</div>
<div class="col-md-2 form-group p-2"><!--
(click)="valuestateall == 1 || valuestateall == 2 || valuestateall == 3 ? updatestate(item, rowIndex, valuestateall) : false"-->
<select formControlName="valuestateall" name="valuestateall" id="valuestateall" class="form-control selectxt">
<option value="">- Elegir Estado -</option>
<option value="1">Atender</option>
<option value="2" >Atendido</option>
<option value="3" >Inactivo</option>
</select>
</div>
<div class="form-check col-md-1_5 p-2 d-flex">
<input (change)="isSelected = !isSelected" type="checkbox" class="form-check-input" id="exampleCheck1">
<label class="form-check-label" for="exampleCheck1">Seleccionar todo</label>
</div>
</div>
<div class="card-body">
<div class="cargando">
<i class="pi pi-spin pi-spinner" style="font-size: 6rem" *ngIf="!data"></i>
</div>
<div class="table-responsive">
<p-table [value]="data" *ngIf="data">
<ng-template pTemplate="header">
<tr>
<th *ngFor="let item of tableHeader"
(click)="toggle = !toggle;orderItems(item, toggle)">{{item.name}}
<i *ngIf="item.value != orderHeaderTable"
class="p-sortable-column-icon pi pi-fw pi-sort-alt"></i>
<i [ngClass]="{'fas' : true, 'fa-chevron-down': toggle && item.value == orderHeaderTable, 'fa-chevron-up': !toggle && item.value == orderHeaderTable}"
class="fas fa-chevron-down"></i>
</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-item let-rowIndex="rowIndex" let-valuestateall>
<tr>
<td>{{ (item.vehicle) ? item.vehicle.name : '' }}</td>
<td>{{ item.vin }}</td>
<td>{{ item.year }}</td>
<td>{{ item.names }}</td>
<td>{{ item.description }}</td>
<td>
<span *ngIf="item.state == 1" class="badge badge-success">Atender</span>
<span *ngIf="item.state == 2" class="badge badge-warning">Atendido</span>
<span *ngIf="item.state == 3" class="badge badge-danger">Inactivo</span>
<div class="form-check float-right">
<!---- [checked]="isSelected" (change)="onChange(data.inputcheck, $event.target.checked)"
*ngIf="checked ? updatestate(item, rowIndex, valuestateall) : true"-->
<input type="checkbox" ng-true-value="1" ng-false-value="0"
class="form-check-input" id="check_{{rowIndex}}" name="check_{{rowIndex}}" [checked]="isSelected"
(click)="updatestate(item, rowIndex, 3)">
</div>
</td>
<td>{{ item.created_at | date:'dd-MM-yyyy': '+0200' : 'es-PE'}}</td>
<td class="no-padding">
<button type="button" class="btn btn-outline-primary btn-btn-edit-delete openModal"
data-toggle="modal" (click)="openModal(item)">
<i class="fa fa-edit"></i>
</button>
<button [disabled]="buttonDelete && itemSelected == rowIndex" id="{{rowIndex}}"
(click)="delete(item, rowIndex)" label="delete" type="button" class="btn btn-danger">
<i *ngIf="!buttonDelete || itemSelected != rowIndex" class="fa fa-trash"
aria-hidden="true"></i> <i *ngIf="buttonDelete && itemSelected == rowIndex"
class="fa fa-cog fa-5x fa-spin" aria-hidden="true"
style="font-size: 16px;"></i>
</button>
</td>
</tr>
<tr class="text-center" *ngIf="!data?.length > 0">
<td colspan="10">No se encontro información...</td>
</tr>
</ng-template>
</p-table>
<p-paginator *ngIf="data?.length > 0" styleClass="paginacion" [rows]="limit"
[totalRecords]="totalCount" [rowsPerPageOptions]="[10,20,30,50,100]"
(onPageChange)="paginate($event)" #pPaginator></p-paginator>
</div>
</div>
</div>
</form>
Acualmente la función onclick está dentro de cada input check para poder obtener la posición rowIndex y de esta forma obtener el id para el update.
Otro problema que tengo es que dentro de este bucle tampoco puedo obtener el valor del estado del select.
updatestate(item: any, index: number, valuestateall: number){
console.log('id', item.id);
console.log("index", index);
console.log(valuestateall);
this.confirmationService.confirm({
message: '¿Deseas actualizar todos los estados?',
header: 'Cambiar estado',
icon: 'pi pi-info-circle',
accept: () => {
console.log('updatestate', ('idcheck_'+index));
this.buttonSaveState = true;
this.itemCheckSelected = index;
this.service.edit(item).subscribe((res: any) => {
if (res.code === 200) {
this.messageService.add({
severity: CMSConstants.MESSAGE_INFO_TYPE,
summary: 'Actualizado',
detail: 'Se actualizó!!'
});
if (this.totalPage - 1 === 0) {
this.params._page = this.params._page - 1;
}
this.getAllData(this.params);
} else {
console.log('error');
this.messageService.add({
severity: CMSConstants.MESSAGE_ERROR_TYPE,
summary: 'Error',
detail: 'No se ha podido actualizar'
});
}
this.resetAll();
}, error => {
console.log('error');
this.messageService.add({
severity: CMSConstants.MESSAGE_ERROR_TYPE,
summary: 'Error',
detail: 'No se pudo actualizar'
});
this.resetAll();
});
},
reject: (type) => {
}
});
}La funcionalidad sería esta:
1.- Seleccionar todos los elementos
2.- Seleccionar el nuevo estado
3.- Guardar el nuevo estado para todos los elementos seleccionados
Mi duda es cómo obtener el row index fuera del bucle (let-item let-rowIndex="rowIndex") y/o cómo obtener el valor del select (valuestateall)
fuera del bucle, el llamado está dentro del input check dentro del bucle. Le puse por defecto 3, ya que tampoco obtiene el value (<input type="checkbox" ng-true-value="1" ng-false-value="0" class="form-check-input" id="check_{{rowIndex}}" name="check_{{rowIndex}}" [checked]="isSelected"
(click)="updatestate(item, rowIndex, 3)">)
