Questions tagged [ngx-datatable]
Use this for questions about the ngx-datatable package for Angular 2+
456
questions
0
votes
0
answers
22
views
ngx-datatable - Filtered data is not showing properly on the grid
I’m using ngx-datatable (swimlane/ngx-datatable v14). When the user filters, sometimes the grid is not updated with filtered data. The expected row count is right but the grid shows different values (...
0
votes
0
answers
26
views
Angular lazy-load Module and Document Status after loading
I am building application and I am using lazy-load modules, using ngx-datatable I am listening to the right click event on ROWs and Header to show context Menu
The event capturing the mouse position ...
1
vote
1
answer
74
views
How to apply css to ngx-datatable checked row
I tried
.datatable-body-row:checked .datatable-row-group {
background-color: #22e26c !important;
}
Nothing happens, while for hover it works, like this.
.datatable-body-row:hover .datatable-row-...
0
votes
1
answer
102
views
How to customize ngx-datatable css for rows
I try to apply some css for the ngx-datatable element like this.
.datatable-body-row:hover {
background-color: #3387b5;
}
Nothing changed, result are the same. The css remains default setting.
The ...
0
votes
1
answer
42
views
Add custom text 'Loading..' untill data fetch from API
Is there any way show 'Loading' text until data fetch from api. As of now it is showing no data to display
I gone through the documentation did not found anything
0
votes
0
answers
58
views
How to customize ngx-datatable header checkbox behavior
I have made a ngx-datatable with 20 rows paginated by size 10 that introduce behavior like this.
select 10 rows in page(1)
header checkbox is checked
selected count in footer is 10
select 12 rows, ...
2
votes
1
answer
65
views
Is there any way to move paginator from ngx-datatable to header instead of footer?
I set up my ngx-datatable with the paginator inside an angular project as below.
<ngx-datatable class="material" [rows]="rows"...
[count]="count" [limit]=&...
0
votes
1
answer
85
views
Change the ngx-datatable-column name dynamically
I'm using a component ngx-datatable angular version 9. I'm trying change the props namedynamically using a *ngIf command.
Problem: I want to using a attribute the list to show the right name.
Code:
...
0
votes
1
answer
270
views
ngx-datatable disable or enable the checkbox dynamically
I'm using a component ngx-datatable angular version 9. This component has the props [checkboxable]="true" to control the checkbox visibilit.
Problem: I need to control this props ...
1
vote
0
answers
50
views
ngx datatable custom footer own component
I want to use custom footer everywhere for my tables:
http://swimlane.github.io/ngx-datatable/#footer
The issue that I do not want to define html every time in every component, so I want to create my ...
0
votes
0
answers
25
views
How to show particular row on top of table in ngx-datatable
I am working on a different website server dashboard. If any site is down, it will show data as down. If any site is down, I want that row to be shown on top of table. What should I add in my html and ...
0
votes
1
answer
29
views
Problem getting details for any particular cell on mouse hovering in ngx datatable in angular
I am using ngx datatable, importing my data from a json.
I have added some more details to be shown in Column 'domain'.
So while hovering to a particular cell of Column 'domain', i want to get more ...
0
votes
0
answers
164
views
@swimlane/ngx-datatables do not have search option and pagination
I am having trouble integrating swimlane's ngx-datatables to my angular 13 application. I followed everything in here (https://stackblitz.com/edit/ngx-datatable-angular?file=src%2Fapp%2Fbasic%2Fbasic....
0
votes
0
answers
89
views
How to move to next row same column on enter key press in ngxDataTable?
I am using ngxDatatable with a custom template where few of my columns are editable:
<ngx-datatable [rows]='datasource'>
<ngx-datatable-column *ngFor="let col of customCols; index as ...
0
votes
1
answer
91
views
SassError: Can't find stylesheet to import. -> @import '~@swimlane/ngx-datatable/themes/bootstrap.scss';
I am using @swimlane/ngx-datatable in one of my Angular Projects,
when I do ng build --configuration=myconfig on my local system, it builds without any errors and it even runs well by doing ng serve.
...
0
votes
0
answers
20
views
Add new form for upload file in ngx-datatable angular
I am working for database ngx-datatable in angular. I am showing numbers of files in datatable but i want to add more button on top and show a new form under the all files but I am unable to find how ...
0
votes
0
answers
23
views
Pin footer to bottom of the screen with paging in swimline-ngx-datatable
I want the footer of the datatable to always stay pinned at the bottom of the screen.
Table version: ngx-datatable:^1.0.3,
Angular version: 10.1.5
Browser: all
Language: TypeScript 4.0.3
This ...
0
votes
2
answers
621
views
Error: NullInjectorError: R3InjectorError(AuthorModule)[ScrollbarHelper -> ScrollbarHelper -> ScrollbarHelper -> ScrollbarHelper]:
I'm following abp framework tutorial and Author route give the folowing error "ERROR Error: Uncaught (in promise): NullInjectorError: R3InjectorError(AuthorModule)[ScrollbarHelper -> ...
0
votes
1
answer
82
views
How can a double/dbl click on row be implemented for Angular ngx-datatable?
The ngx-datatable does not have a Output property for double clicking a row.
The activate output property emits all events, this could probably be used.
How can I implement this?
0
votes
1
answer
72
views
Datatable undefined type - Angular11
We have services.ts . Which needs 2 arguments
UPDATED
seems like i was looking the error wrong. this method was causing the console error
private checkLink(row, options) {
if (options.type ==='...
1
vote
0
answers
346
views
Unable to resolve dependency tree while installing ngx-datatable
I am trying to install the ngx-datatable module for my angular project. But whenever i try to install it with npm this error shows.
I tried doing npm i @swimlane/ngx-datatable --force and that ...
0
votes
1
answer
401
views
*ngIf show button for row on ngx-datatable
I have a populated table and by default on load, one of the columns has a hidden element by a show button. I'm looking to show the input per row, but currently when the button is clicked, the hidden ...
0
votes
0
answers
200
views
swimlane/ngx-datatable having performance issue with Angular 13
I Updated my app to from angular 12 to 13, during the upgrade process I added below overrides in package.json as 6.6.7 version of rxjs was throwing error in Angular 13
"overrides": {
&...
0
votes
0
answers
116
views
Ngx-Datatable sorting by reference column doesn't work
this is my .ts file, when I sort or filter with 'title', everything works fine, when I try to sort or filter with status.descr it just doesn't do anything.
this.cols = [
{ prop: 'title', name: '...
1
vote
0
answers
523
views
Angular async pipe not working after map observable
I'm using ngx-datatable and I have data source with string or Observable<string> values.
Here is a part of html template:
<ng-container *ngFor="let condition of row.conditions">
...
0
votes
0
answers
74
views
add three column inside of one column in ngx-datatable in angular
i am fresher in the angular. I want to result like this image (click me for see image)
0
votes
0
answers
40
views
How to write directive to allow input field with type= text to allow 'words'?
enter image description here I am using ngxdatatable in reactive forms where user can update all the fields in the table. i have three fields/columns for e.g fields a,b and c and they are dynamic ...
0
votes
2
answers
1k
views
How to sort angular ngx datatable with specific criteria
I am developing a table view with angular, ngx datatable where I have few columns that can be sorted. For example I have a column called "full prize" which shows addition of two fields which ...
0
votes
0
answers
394
views
Show images in a table. ngx-datatable
I am trying to display images in a table. In the database, some don't have a picture and are Null instead.
Therefore, I only show data with a picture, and the rest display an error:
ERROR TypeError: ...
0
votes
0
answers
719
views
Dynamically change template in Angular Table (ngx-datatable)
I have a question, how can i change my ng-template based on a column property.
I tried this one but that evaluation returns a string not a template so it results in error.
<ng-template let-...
1
vote
0
answers
224
views
how to show custom results in ngx-pagination and ngx-datatable pages
i'm having a problem at hand like this. I have records up to 10 in my JSON output but the client wants to show 32 records like 10 in each page. until, the fourth page and wants the 4th page to show ...
0
votes
1
answer
372
views
Get boolean value as a checkbox
I have a database. I want to display a table with all the data and get boolean values as a checkbox.
<ngx-datatable-column name="Value">
<ng-template ngx-datatable-cell-...
0
votes
0
answers
2k
views
Angular - ngx-datatable horizontal scroll problem
I'm using angular and ngx-datable to display a dynamic list.
The first two left columns are fixed and a horizontal scroll bar appears (that's what I want it to do).
the problem is that when I'm ...
1
vote
0
answers
266
views
ngx-datatable Error with summaryRow when scrollbarV is activate
I have a problem with my datatable.
When I want to display a summary row at the bottom of the database, I got this error:
ERROR Error: query at index 10 failed: Fenwick tree array not initialized.
...
0
votes
0
answers
222
views
Why is some columns hiding in ngx-datatable?
I try to do a ngx-datatable, but the last columns are hiding. Anybody know why?
<ngx-datatable #tableResponsive class="bootstrap core-bootstrap" [columnMode]="ColumnMode.force" [...
0
votes
1
answer
348
views
Ionic/Angluar NGX Datatable: Transform boolean values to string
I am developing an Ionic/Angular application and I am using NGX datatable. It works pretty good, but I need to display the boolean values of one column not as "true" or "false" (...
2
votes
2
answers
1k
views
Angular - How to resolve "Property does not exist on type 'never'" in @tusharghoshbd/ngx-datatable Advanced Search
In my Angular-13 project I am trying to implement Advance Search in @tusharghoshbd/ngx-datatable
I have this code:
interface:
export interface Merchant {
id?: number;
merchant_name?: string;
...
0
votes
1
answer
515
views
ngx-datatable - Any way to preserve column order after a user repositions them?
Users like the out of the box ability to drag columns around to reorder them in the ngx-datatable. However, they want me to preserve the order after they get them exactly like they like them. I ...
0
votes
1
answer
785
views
How can I show nested objects in single ngx-datatable cell?
IAttribute:
export interface IAttribute {
id: number;
attributeName: string;
attributeValues: IAttributeValue[];
}
IAttributeValue:
export interface IAttributeValue {
Value: string;
attributeId: ...
1
vote
1
answer
401
views
How do I display a button only when a row is selected in Angular
I have added an extra column to a table for a button to export a row from my table. I’m trying to make it so that button is only displayed for the selected row. (When you haven’t selected any rows ...
0
votes
1
answer
850
views
Ngx-datatable is not showing the data
I am working on an angular component, I am using ngx-datatable for displaying the table data.
The table is not showing the data.
the table :
<ngx-datatable
class="ngx-...
1
vote
1
answer
635
views
Implementing a @hostListener only when component is called
Angular application that uses a ngx-datatable. This table auto populates its [rows]. Within these rows is an [action] that displays a popup of items. This popup is a seperate component away from the ...
1
vote
1
answer
263
views
angular 11 swimlane/ngx-datatable in custom library not add the ngx-datatable class in some projects
I have created an angular custom library to easy configurate my tables projectwide.
I have crate a default config that defined in my appmodule and i have a tablespecific config in my component for ...
1
vote
1
answer
322
views
I can't npm install on cloned ngx-datatable repo
Hello stackoverflow community!
After years of lurking around, this is finally the time to ask a question myself and perpetuate it so others can find a solution as well. When I clone other projects and ...
0
votes
1
answer
258
views
How to synchronize two ngx-datatable data sorting
I built a shared component that uses <ngx-datatable> inside the component and passes all the data inputs to get it working. Everything works as expected.
The problem is I have a request to ...
1
vote
1
answer
772
views
swimlane / ngx-datatable: how to detect if a row on click is expand or not?
If you click on a line, it expands and the details can be seen. This apparently happens with the "toggle". But how can I now determine whether a line has already been expanded?
HTML
<ngx-...
0
votes
1
answer
619
views
How to set columnMode/... of a ngx-datatable without binding to ViewModel?
I'm starting to use ngx-datatable.
I've currently this:
<ngx-datatable
#table
class="material"
[columns]="columns"
[...
0
votes
1
answer
413
views
how change a style of ngx datatable column on scroll?
I want a add a particular style to a frozenLeft ngx datatable column upon scroll. So far what I have achieved is triggering a function call on scroll and setting a flag to true to indicate that the ...
1
vote
1
answer
139
views
What settings does Firefox Safe mode changes, besides disabling themes, extensions or add ons?
There is an unusual behavior when using the scroll bar from Angular Material cdk-virtual-scroll-viewport using Firefox 88+ (Linux, Windows), Chrome works fine. The scrollbar jumps, remaining on top / ...
0
votes
0
answers
242
views
TemplateRef<any> | ngx-datatable
I'm facing the next error while trying to follow ngx-datatable demo and using Angular 12.
I have installed the npm package, I alredady have imported the module in the app.module.ts, but using the demo ...