refresh array without page load

Question

I implemented a functionality in angular, Where i'm showing the filtered array details in grid. on clicking a button in grid, i'm calling a function onClick() whre we can update the record. When the record is updated, i need to refresh the filtered array, without reloading the page. Help me achieve this functionality.

 selected:any;
  filtered : any=[];
  Form: FormGroup;

    onOptionsSelected() {
      if (this.Form.invalid) {
        alert('Please choose an option')
        return;        
      }
      else{
      this.filtered = this.studentInfo.filter(t=>t.Id == this.selected);
      }      
    }  

    public Response: any = [];

    onClick(index: number, id: string, roll_no: string){
      const obj = {
        id : id,
        roll_no : roll_no,
      }      
     this.Srvc.postmethod('students', obj).subscribe((response:any)=>{
        this.Response = response;
        if(this.Response.status === 200)
        {
          alert('Record updated');                  
        }  
   });
  }

Answer 1

Try below code.

Update the filtered array with the status as Y at desired index so that it will reflect in grid.

 onClick(index: number, id: string, roll_no: string){
          const obj = {
            id : id,
            roll_no : roll_no,
          }      
         this.Srvc.postmethod('students', obj).subscribe((response:any)=>{
            this.Response = response;
            if(this.Response.status === 200)
            {
              alert('Record updated');  
              this.filtered[index].present = 'Y'  // try this line
            }  
       });
      }