Issues in custom filtering boolean value in primeng Table
I am using primeng Table for displaying data in my Angular app,
the issue i have right now is i have to use filter but with conditions, for example if user type 0, 1, or 2, i have to display data based on this, what i am trying is this
if(value == 0) {
table.filter(value, fieldName, 'equals');
} else if(value == 1) {
table.filter(0, fieldName, 'gt');
table.filter(false, 'array[0].fieldName', 'equals');
} else if(value == 2) {
table.filter(0, fieldName, 'gt');
table.filter(true, 'array[0].fieldName', 'equals');
}
if user type 0 its filtering fine, but the issue is when he type 1 or 2 because i have to filter from 2 fields, i am not sure what i am trying to do is possible in primeng or not.
angular typescript primeng primeng-datatable
add a comment |
I am using primeng Table for displaying data in my Angular app,
the issue i have right now is i have to use filter but with conditions, for example if user type 0, 1, or 2, i have to display data based on this, what i am trying is this
if(value == 0) {
table.filter(value, fieldName, 'equals');
} else if(value == 1) {
table.filter(0, fieldName, 'gt');
table.filter(false, 'array[0].fieldName', 'equals');
} else if(value == 2) {
table.filter(0, fieldName, 'gt');
table.filter(true, 'array[0].fieldName', 'equals');
}
if user type 0 its filtering fine, but the issue is when he type 1 or 2 because i have to filter from 2 fields, i am not sure what i am trying to do is possible in primeng or not.
angular typescript primeng primeng-datatable
add a comment |
I am using primeng Table for displaying data in my Angular app,
the issue i have right now is i have to use filter but with conditions, for example if user type 0, 1, or 2, i have to display data based on this, what i am trying is this
if(value == 0) {
table.filter(value, fieldName, 'equals');
} else if(value == 1) {
table.filter(0, fieldName, 'gt');
table.filter(false, 'array[0].fieldName', 'equals');
} else if(value == 2) {
table.filter(0, fieldName, 'gt');
table.filter(true, 'array[0].fieldName', 'equals');
}
if user type 0 its filtering fine, but the issue is when he type 1 or 2 because i have to filter from 2 fields, i am not sure what i am trying to do is possible in primeng or not.
angular typescript primeng primeng-datatable
I am using primeng Table for displaying data in my Angular app,
the issue i have right now is i have to use filter but with conditions, for example if user type 0, 1, or 2, i have to display data based on this, what i am trying is this
if(value == 0) {
table.filter(value, fieldName, 'equals');
} else if(value == 1) {
table.filter(0, fieldName, 'gt');
table.filter(false, 'array[0].fieldName', 'equals');
} else if(value == 2) {
table.filter(0, fieldName, 'gt');
table.filter(true, 'array[0].fieldName', 'equals');
}
if user type 0 its filtering fine, but the issue is when he type 1 or 2 because i have to filter from 2 fields, i am not sure what i am trying to do is possible in primeng or not.
angular typescript primeng primeng-datatable
angular typescript primeng primeng-datatable
asked Nov 13 '18 at 18:06
Muhammad ArslanMuhammad Arslan
167112
167112
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
table.filter(...)
works on a single column.
It is designed to filter the data on a particular column. The following is the type definition of the filter
function:
filter(value: any, field: any, matchMode: any): void;
But you are on the right path as it is possible to set different filters, one on each column, which are then combined with AND
to filter the data of the table.
For example the following function can filter using multiple columns:
filter(dt) {
dt.filter('Blue', 'color', 'equals');
dt.filter('Bmw', 'brand', 'equals');
}
Here's an example of a template:
<p-table #dt [value]="cars">
<ng-template pTemplate="header">
<tr>
<th>
Color
</th>
<th>
Brand
</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-car>
<tr>
<td>{{car.color}}</td>
<td>{{car.brand}}</td>
</tr>
</ng-template>
</p-table>
<button (click)="filter(dt)">Get Blue Bmw</button>
And a complete component:
export class MyComponent {
cars: {
color: string;
brand: string;
};
constructor() {
this.cars = [{
color: "blue",
brand: "bmw"
},{
color: "red",
brand: "bmw"
}];
}
filter(dt) {
dt.filter('Blue', 'color', 'equals');
dt.filter('Bmw', 'brand', 'equals');
}
}
The button will apply the filter on multiple columns which will result in data
being filtered with color equals Blue
AND
brand equals Bmw
.
Edit: It works the same for boolean
.
cars: {
color: string;
brand: string;
enable: boolean;
};
filter(dt) {
dt.filter('Blue', 'color', 'equals');
dt.filter('Bmw', 'brand', 'equals');
dt.filter(true, 'enable', 'equals');
}
In the code you pasted 'array[0].fieldName'
is treated as a literal due to the quotes, therefore it looks for a field name "array[0].fieldName" and does not evaluate it.
thanks for your answer, i am using table not p-table and it looks like the issue is boolean value because i try same code on text fields and it works for 2 columns
– Muhammad Arslan
Nov 13 '18 at 20:59
our code is same can you please confirm code for boolean value, i am applying this on boolean field
– Muhammad Arslan
Nov 13 '18 at 21:01
how i comare boolean value ?
– Muhammad Arslan
Nov 14 '18 at 3:20
@MuhammadArslan I've updated the answer to answer your question.
– Kimserey Lam
Nov 14 '18 at 9:36
thanks for your answer, then how i can add my field because its inside another array?
– Muhammad Arslan
Nov 14 '18 at 16:19
|
show 4 more comments
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53287057%2fissues-in-custom-filtering-boolean-value-in-primeng-table%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
table.filter(...)
works on a single column.
It is designed to filter the data on a particular column. The following is the type definition of the filter
function:
filter(value: any, field: any, matchMode: any): void;
But you are on the right path as it is possible to set different filters, one on each column, which are then combined with AND
to filter the data of the table.
For example the following function can filter using multiple columns:
filter(dt) {
dt.filter('Blue', 'color', 'equals');
dt.filter('Bmw', 'brand', 'equals');
}
Here's an example of a template:
<p-table #dt [value]="cars">
<ng-template pTemplate="header">
<tr>
<th>
Color
</th>
<th>
Brand
</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-car>
<tr>
<td>{{car.color}}</td>
<td>{{car.brand}}</td>
</tr>
</ng-template>
</p-table>
<button (click)="filter(dt)">Get Blue Bmw</button>
And a complete component:
export class MyComponent {
cars: {
color: string;
brand: string;
};
constructor() {
this.cars = [{
color: "blue",
brand: "bmw"
},{
color: "red",
brand: "bmw"
}];
}
filter(dt) {
dt.filter('Blue', 'color', 'equals');
dt.filter('Bmw', 'brand', 'equals');
}
}
The button will apply the filter on multiple columns which will result in data
being filtered with color equals Blue
AND
brand equals Bmw
.
Edit: It works the same for boolean
.
cars: {
color: string;
brand: string;
enable: boolean;
};
filter(dt) {
dt.filter('Blue', 'color', 'equals');
dt.filter('Bmw', 'brand', 'equals');
dt.filter(true, 'enable', 'equals');
}
In the code you pasted 'array[0].fieldName'
is treated as a literal due to the quotes, therefore it looks for a field name "array[0].fieldName" and does not evaluate it.
thanks for your answer, i am using table not p-table and it looks like the issue is boolean value because i try same code on text fields and it works for 2 columns
– Muhammad Arslan
Nov 13 '18 at 20:59
our code is same can you please confirm code for boolean value, i am applying this on boolean field
– Muhammad Arslan
Nov 13 '18 at 21:01
how i comare boolean value ?
– Muhammad Arslan
Nov 14 '18 at 3:20
@MuhammadArslan I've updated the answer to answer your question.
– Kimserey Lam
Nov 14 '18 at 9:36
thanks for your answer, then how i can add my field because its inside another array?
– Muhammad Arslan
Nov 14 '18 at 16:19
|
show 4 more comments
table.filter(...)
works on a single column.
It is designed to filter the data on a particular column. The following is the type definition of the filter
function:
filter(value: any, field: any, matchMode: any): void;
But you are on the right path as it is possible to set different filters, one on each column, which are then combined with AND
to filter the data of the table.
For example the following function can filter using multiple columns:
filter(dt) {
dt.filter('Blue', 'color', 'equals');
dt.filter('Bmw', 'brand', 'equals');
}
Here's an example of a template:
<p-table #dt [value]="cars">
<ng-template pTemplate="header">
<tr>
<th>
Color
</th>
<th>
Brand
</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-car>
<tr>
<td>{{car.color}}</td>
<td>{{car.brand}}</td>
</tr>
</ng-template>
</p-table>
<button (click)="filter(dt)">Get Blue Bmw</button>
And a complete component:
export class MyComponent {
cars: {
color: string;
brand: string;
};
constructor() {
this.cars = [{
color: "blue",
brand: "bmw"
},{
color: "red",
brand: "bmw"
}];
}
filter(dt) {
dt.filter('Blue', 'color', 'equals');
dt.filter('Bmw', 'brand', 'equals');
}
}
The button will apply the filter on multiple columns which will result in data
being filtered with color equals Blue
AND
brand equals Bmw
.
Edit: It works the same for boolean
.
cars: {
color: string;
brand: string;
enable: boolean;
};
filter(dt) {
dt.filter('Blue', 'color', 'equals');
dt.filter('Bmw', 'brand', 'equals');
dt.filter(true, 'enable', 'equals');
}
In the code you pasted 'array[0].fieldName'
is treated as a literal due to the quotes, therefore it looks for a field name "array[0].fieldName" and does not evaluate it.
thanks for your answer, i am using table not p-table and it looks like the issue is boolean value because i try same code on text fields and it works for 2 columns
– Muhammad Arslan
Nov 13 '18 at 20:59
our code is same can you please confirm code for boolean value, i am applying this on boolean field
– Muhammad Arslan
Nov 13 '18 at 21:01
how i comare boolean value ?
– Muhammad Arslan
Nov 14 '18 at 3:20
@MuhammadArslan I've updated the answer to answer your question.
– Kimserey Lam
Nov 14 '18 at 9:36
thanks for your answer, then how i can add my field because its inside another array?
– Muhammad Arslan
Nov 14 '18 at 16:19
|
show 4 more comments
table.filter(...)
works on a single column.
It is designed to filter the data on a particular column. The following is the type definition of the filter
function:
filter(value: any, field: any, matchMode: any): void;
But you are on the right path as it is possible to set different filters, one on each column, which are then combined with AND
to filter the data of the table.
For example the following function can filter using multiple columns:
filter(dt) {
dt.filter('Blue', 'color', 'equals');
dt.filter('Bmw', 'brand', 'equals');
}
Here's an example of a template:
<p-table #dt [value]="cars">
<ng-template pTemplate="header">
<tr>
<th>
Color
</th>
<th>
Brand
</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-car>
<tr>
<td>{{car.color}}</td>
<td>{{car.brand}}</td>
</tr>
</ng-template>
</p-table>
<button (click)="filter(dt)">Get Blue Bmw</button>
And a complete component:
export class MyComponent {
cars: {
color: string;
brand: string;
};
constructor() {
this.cars = [{
color: "blue",
brand: "bmw"
},{
color: "red",
brand: "bmw"
}];
}
filter(dt) {
dt.filter('Blue', 'color', 'equals');
dt.filter('Bmw', 'brand', 'equals');
}
}
The button will apply the filter on multiple columns which will result in data
being filtered with color equals Blue
AND
brand equals Bmw
.
Edit: It works the same for boolean
.
cars: {
color: string;
brand: string;
enable: boolean;
};
filter(dt) {
dt.filter('Blue', 'color', 'equals');
dt.filter('Bmw', 'brand', 'equals');
dt.filter(true, 'enable', 'equals');
}
In the code you pasted 'array[0].fieldName'
is treated as a literal due to the quotes, therefore it looks for a field name "array[0].fieldName" and does not evaluate it.
table.filter(...)
works on a single column.
It is designed to filter the data on a particular column. The following is the type definition of the filter
function:
filter(value: any, field: any, matchMode: any): void;
But you are on the right path as it is possible to set different filters, one on each column, which are then combined with AND
to filter the data of the table.
For example the following function can filter using multiple columns:
filter(dt) {
dt.filter('Blue', 'color', 'equals');
dt.filter('Bmw', 'brand', 'equals');
}
Here's an example of a template:
<p-table #dt [value]="cars">
<ng-template pTemplate="header">
<tr>
<th>
Color
</th>
<th>
Brand
</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-car>
<tr>
<td>{{car.color}}</td>
<td>{{car.brand}}</td>
</tr>
</ng-template>
</p-table>
<button (click)="filter(dt)">Get Blue Bmw</button>
And a complete component:
export class MyComponent {
cars: {
color: string;
brand: string;
};
constructor() {
this.cars = [{
color: "blue",
brand: "bmw"
},{
color: "red",
brand: "bmw"
}];
}
filter(dt) {
dt.filter('Blue', 'color', 'equals');
dt.filter('Bmw', 'brand', 'equals');
}
}
The button will apply the filter on multiple columns which will result in data
being filtered with color equals Blue
AND
brand equals Bmw
.
Edit: It works the same for boolean
.
cars: {
color: string;
brand: string;
enable: boolean;
};
filter(dt) {
dt.filter('Blue', 'color', 'equals');
dt.filter('Bmw', 'brand', 'equals');
dt.filter(true, 'enable', 'equals');
}
In the code you pasted 'array[0].fieldName'
is treated as a literal due to the quotes, therefore it looks for a field name "array[0].fieldName" and does not evaluate it.
edited Nov 14 '18 at 9:35
answered Nov 13 '18 at 20:26
Kimserey LamKimserey Lam
10314
10314
thanks for your answer, i am using table not p-table and it looks like the issue is boolean value because i try same code on text fields and it works for 2 columns
– Muhammad Arslan
Nov 13 '18 at 20:59
our code is same can you please confirm code for boolean value, i am applying this on boolean field
– Muhammad Arslan
Nov 13 '18 at 21:01
how i comare boolean value ?
– Muhammad Arslan
Nov 14 '18 at 3:20
@MuhammadArslan I've updated the answer to answer your question.
– Kimserey Lam
Nov 14 '18 at 9:36
thanks for your answer, then how i can add my field because its inside another array?
– Muhammad Arslan
Nov 14 '18 at 16:19
|
show 4 more comments
thanks for your answer, i am using table not p-table and it looks like the issue is boolean value because i try same code on text fields and it works for 2 columns
– Muhammad Arslan
Nov 13 '18 at 20:59
our code is same can you please confirm code for boolean value, i am applying this on boolean field
– Muhammad Arslan
Nov 13 '18 at 21:01
how i comare boolean value ?
– Muhammad Arslan
Nov 14 '18 at 3:20
@MuhammadArslan I've updated the answer to answer your question.
– Kimserey Lam
Nov 14 '18 at 9:36
thanks for your answer, then how i can add my field because its inside another array?
– Muhammad Arslan
Nov 14 '18 at 16:19
thanks for your answer, i am using table not p-table and it looks like the issue is boolean value because i try same code on text fields and it works for 2 columns
– Muhammad Arslan
Nov 13 '18 at 20:59
thanks for your answer, i am using table not p-table and it looks like the issue is boolean value because i try same code on text fields and it works for 2 columns
– Muhammad Arslan
Nov 13 '18 at 20:59
our code is same can you please confirm code for boolean value, i am applying this on boolean field
– Muhammad Arslan
Nov 13 '18 at 21:01
our code is same can you please confirm code for boolean value, i am applying this on boolean field
– Muhammad Arslan
Nov 13 '18 at 21:01
how i comare boolean value ?
– Muhammad Arslan
Nov 14 '18 at 3:20
how i comare boolean value ?
– Muhammad Arslan
Nov 14 '18 at 3:20
@MuhammadArslan I've updated the answer to answer your question.
– Kimserey Lam
Nov 14 '18 at 9:36
@MuhammadArslan I've updated the answer to answer your question.
– Kimserey Lam
Nov 14 '18 at 9:36
thanks for your answer, then how i can add my field because its inside another array?
– Muhammad Arslan
Nov 14 '18 at 16:19
thanks for your answer, then how i can add my field because its inside another array?
– Muhammad Arslan
Nov 14 '18 at 16:19
|
show 4 more comments
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53287057%2fissues-in-custom-filtering-boolean-value-in-primeng-table%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown