Questions tagged [ngx-datatable]

Use this for questions about the ngx-datatable package for Angular 2+

Filter by
Sorted by
Tagged with
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 ...
  • 7,146
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. ...
  • 615
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?
  • 5,604
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 ==='...
  • 161
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 ...
  • 139
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": { &...
  • 31
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: ...
  • 9
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-...
  • 37
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-...
  • 9
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. ...
  • 331
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" [...
  • 1,415
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" (...
  • 25
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; ...
  • 857
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 ...
  • 1,609
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 ...
  • 3,097
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 ...
  • 93
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-...
  • 350
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" [...
  • 19k
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 ...

1
2 3 4 5
10