How To Sort Row Of Grid in Angular 6

How To Sort Row Of Grid in Angular 6

Setup For Sortable JS

1). Install Plugin  "'angular-sortablejs"

2). set reference or import service
     import { SortablejsOptions } from 'angular-sortablejs';

3).Define Variable in Class
    public sortableOptions: SortablejsOptions;

4).Define Function in class for Get Rows of Grid or table
   get fieldRows() {
     return this.contractFormService.fieldRows(this.newContractIOTForm, this.discountType,                   this.discountTypeID, this.j);

5).Call Method in OnInit() method
    this.sortableOptions = {
    onSort: (event: any) => {
    this.fieldRows, this.discountTypeID);

6). set property of Grid in html of Currunt ts file 

   [sortablejs]="fieldRows" [sortablejsOptions]="sortableOptions"

7). Define Common Function for sorting Functionality for Data
 sortFormFields(j: number, newContractIOTForm: FormGroup, discountType: string,            arrayIndexes: AbstractControl[], TypeID) {
   const discountTypeList = newContractIOTForm.get(discountType).get('DiscountTypes').value;
   if (discountTypeList) {
   for (let index = 0; index < discountTypeList.length; index++) {
   const discountTypeID = discountTypeList[index].DiscountTypeID;
  const offerFields: FormArray = this.getDiscountFields(newContractIOTForm, discountType,     discountTypeID);
   if (TypeID === discountTypeID) {
   const _temp: FormArray = offerFields.controls[j] as FormArray;
    arrayIndexes.forEach((ele: FormGroup, i) => {
  const fields = _temp.controls[i] as FormGroup;

No comments:

Post a comment

Thank You For Your Great Contribution

Featured Post

How to convert xml to json using angular / javascript

 How to convert xml to json using angular / javascript import  {  Injectable  }  from   '@angular/core' ; @ Injectable ({    provide...

Popular Posts