Allow the user select the number of elements in a page with pageSizes

Ane

Asked On January 24, 2019 11:37 AM UTC

Hello,

Can you please give an example of how to use the paseSizes of the Grid? I want to allow the user to select how many elements he or she wants to see in each page (20, 50 or 100).

Thank you in advance,

Ane

Reply | Reply with quote

Madhu Sudhanan P [Syncfusion]

Replied On January 24, 2019 11:50 AM UTC

Hi Ane,

Thanks for contacting Syncfusion support.

You can achieve this requirement using page size dropdown feature. Please refer to the below link to achieve this.

https://ej2.syncfusion.com/angular/documentation/grid/paging/#pager-with-page-size-dropdown

Regards,

Madhu Sudhanan P

Reply | Reply with quote

Ane

Replied On January 24, 2019 01:11 PM UTC

Solved! Now I have another problem. I want to filter 2 of a 4 colums grid and I want them to be type checkbox. I have tried using [filter] but it shows me an error.

Thank you in advance!

Reply | Reply with quote

Madhu Sudhanan P [Syncfusion]

Replied On January 25, 2019 04:06 AM UTC

Hi Ane,

Could you please share the screenshot of the error or the stack trace to check the reported problem.

Regards,

Madhu Sudhanan P

Reply | Reply with quote

Ane

Replied On January 25, 2019 07:58 AM UTC

Hello,

Now it doesn't show me that error but it filters all the columns and I just want to filter 2 columns. How can I solve that problem?

<ejs-grid [dataSource]='data' [enableHover]='false' [allowSelection]='false' [allowFiltering]='true' [filterSettings]='filterSettings' [allowPaging]='true' [pageSettings]="pageSettings">
    <e-columns>
      <e-column field='aaaa' headerText='AAAA' textAlign='Center'></e-column>
      <e-column field='bbbb' headerText='BBBB' [filter] = 'filter' textAlign='Center'></e-column>
      <e-column field='cccc' headerText='CCCC' textAlign='Left'></e-column>
      <e-column field='dddd' headerText='DDDD' textAlign='Center'></e-column>
    </e-columns>
  </ejs-grid>
  
In the .ts: 

 filterSettings: FilterSettingsModel;
 filter: IFilter;

 ngOnInit() {
    this.filterSettings = { type: 'Menu', showFilterBarStatus: false };
    this.filter = { type : 'CheckBox'};
  }

Reply | Reply with quote

Madhu Sudhanan P [Syncfusion]

Replied On January 28, 2019 04:22 AM UTC

Hi Ane,

Thanks for the update.

We understood that you want to disable filter for some of the columns, if so please set the columns.allowFiltering property as false.

<e-column field='bbbb' headerText='BBBB' [allowFiltering]='false' textAlign='Center'></e-column>

https://ej2.syncfusion.com/angular/documentation/grid/filtering/

Regards,

Madhu Sudhanan P

Reply | Reply with quote

Ane

Replied On January 28, 2019 11:23 AM UTC

Thank you!

Reply | Reply with quote

Madhu Sudhanan P [Syncfusion]

Replied On January 28, 2019 11:34 AM UTC

Hi Ane,

Thanks for the update. Please get back to us if you require further assistance.

Regards,

Madhu Sudhanan P

Reply | Reply with quote

Thread ID:	Created:	Updated:	Platform:	Replies:
142274	Jan 24,2019 11:37 AM UTC	Jan 28,2019 11:34 AM UTC	Angular - EJ 2	7

Thread ID:

Created:

Updated:

Platform:

Replies:

Please sign in to access our forum

CONTACT US