Questions tagged [gridjs]
Grid.js is an open-source table library written in TypeScript
79
questions
-1
votes
0
answers
80
views
How to alternate background color for rows using the javascript library gridjs?
I did not find a way to do this after reading the full project documentation. You can customize table, td but not tr. I tried to add custom CSS, but it does not work:
tr:nth-child(even) {
background-...
0
votes
0
answers
69
views
Liveweave vs jsfiddle and codepen - Same code, different results
I'm using liveweave to design an app. Right now everything is working fine on the console of this editor. However, when I downloaded the code and tried it in Google Chrome, I noticed that my table ...
0
votes
0
answers
17
views
Side by Side Grids
How could I approach the following ...
I have a dataset, lets say it has 75 rows
I would like this data to be displayed in a grid, the first 25 rows in the left hand grid and then next 25 rows in the ...
0
votes
0
answers
62
views
How to get the inner text of an anchor tag from a gridjs table
Consider an anchor tag for instance: <a href="/stats/ABCXYZ/1">ABCXYZ</a> I want to be able to extract the text ABCXYZ and pass it to myFunction as an argument. This anchor tag ...
1
vote
1
answer
110
views
GridJS adding data to table using a JSON array
I have a GridJS table in my project in javascript and I need to put data in it from a JSON array
let data = [{"nr": 1, "time": "26.000", "ao5": "26.000&...
0
votes
1
answer
58
views
how to get sql data in [["row1","row2","row3"],["row1","row2","row3"]] [duplicate]
I want to get sql data for a gridjs table
var jobListAllData = [
["Marketing Directortt", "Meta4Systems", "Vinninga, Sweden", "$250 - $800", "0-5 ...
0
votes
1
answer
82
views
GridJs isn't sorting column when converting from HTML table
I'm trying to use GridJS to sort/search an existing html table.
But sorting isn't working. The search bar is ok.
Any idea ? I think it should be easy but i stuck there
const table = new ...
0
votes
0
answers
57
views
Searching in gridjs HTML fields
My table has nearly all columns filled with HTML links like
<a href="...">content</a>
How shoud I formulate the search function so that the normal gridjs search be executed also ...
0
votes
1
answer
226
views
Pagination issue with fetching data in React using useState and useEffect
Pagination issue with fetching data in React using useState and useEffect
I'm working on a React application where I have a UserList component that displays a list of users fetched from a backend API. ...
0
votes
0
answers
155
views
How to update only gridjs record not whole table when attribute changes inside the data in gridjs-react
How to update only gridjs record not whole table when attribute changes inside the data in gridjs-react
I am have added a checkbox as a viurtual dom. when I select the checkbox into 2nd or 3rd page
it ...
1
vote
1
answer
50
views
It's possible to set <tr> height of element that has 'display:table-row'?
I'm using grid.js to render a table in a webpage.
Having a fixed-height table expressed in vh units (60vh), with less rows than the pagination limit i got this strange effect:
gridjs-tablerow-height
...
0
votes
1
answer
373
views
Custom pagination in gridjs with react
I want to do custom pagination with gridjs and react. So, I have say 1000 records to show in table. And records per page will be 10. So, I want to show in the pagination footer like this -->
...
0
votes
1
answer
192
views
I want to sort date column in gridjs and i am displaying date in mm/dd/yyyy format
I want to sort date column in gridjs and i am displaying it in mm/dd/yyyy format.
Currently it is taking as string and sorting incorrectly.
Any formatter or sort option available for date column in ...
0
votes
0
answers
260
views
Grid.js from HTML Table with RowSelection
I would like to use https://gridjs.io/ with a HTML table that is already rendered. I would also like to utilize the RowSelection Plugin. How can I do both.
Here is the code I would like to execute.
...
0
votes
0
answers
149
views
customize gridjs onclick on htmlheader column
I am using gridjs. I want to have a select all checkbox instead of column name
how can I do that, I have written a following code for a grid. I am able to show the check box instead of the column name
...
0
votes
1
answer
494
views
Use SolidJS components within Grid.js
I'm trying to use a custom formatter feature of Grid.js with SolidJS component. Here is a sandbox on Stackblitz.
I am getting the following error:
computations created outside a `createRoot` or `...
0
votes
1
answer
321
views
How to customize searchable fields with selector in gridjs
In gridjs there is an the example of using selector in search field.
const grid = new Grid({
columns: [
{
name: 'Name',
formatter: (cell) => cell.firstName
},
'Email',
'...
1
vote
1
answer
496
views
When try server side sorting with Grid.js it does multiple calls to the server that could be avoided
I'm using Grid.js accessing server data and performing server side sorting (this on Grid.js doc ).
My problem is that when I try to sort a column it makes a number of calls to the server equal to the ...
0
votes
0
answers
59
views
Page Number not Rendering for Server Side Pagination in GridJS on Vue3.x
Am trying to achieve Server Side Pagination using Gridjs in my Vue Application, the data is rendering correctly but pagination is not showing in the grid bottom.
This is my code link what i have tried ...
1
vote
0
answers
172
views
Which event is get emmited by gridjs after search completion
I am trying to use the event from gridjs. but as I was only able to access the
ready, load, and beforeload event.but for search event completion.
or other events where can I find the documentation for ...
0
votes
1
answer
426
views
How does one access all of the paginated data in grid.js?
I am using grid.js along with its selection plugin to have the user select specific rows in the table. An example of the script is shown below with a function that gets called when a button on the ...
0
votes
1
answer
854
views
How to get server side pagination + search + sorting in grid.js?
I can get the table working with server side data and server side search, but when I start trying to add pagination and sorting on top of that (both server side) I get errors and it stops working.
I'...
0
votes
0
answers
99
views
How to adjust row height in gridjs currently it is autosizing based on number of records
My gridjs row is changing based on number of records in the table.
How to give fixed height to the row?
0
votes
0
answers
189
views
wrap gridjs component in a DragDropContext using react-beautiful-dnd
I am not a react expert, and I am trying to integrate a gridjs component with react-beautiful-dnd library. The objective is to add drag and drop functionaly to a gridjs table.
I have create a react ...
0
votes
0
answers
68
views
How to call vue-router link in gridjs?
I'm having a Vue.js application and using gridjs for rending my tables. Everything works fine, except one thing... My code is the following (modified from the original expamle from Grid.js):
<...
2
votes
0
answers
369
views
Active/selected row in grid.js?
We need a grid control in our web application, and we are looking into grid.js. (I’m new to grid.js, so sorry if this is a dumb question. 😊)
Grid.js handle most of our needs – and an MIT license is ...
0
votes
0
answers
682
views
How to add attributes with dynamic values on Grid.js?
I need to add dynamics(conditionals) values to an attribute on GridJs table, but i haven't found a way to do it on render time.
I have a column named "Type" and, for a distinct "Type&...
0
votes
2
answers
133
views
jQuery attr() Method add html tag
I have a search input tag, and I wanted to set a placeholder. In place holder I need to keep a magnify icon, how to do it in jquery? below is the code I tried
$('.gridjs-head .gridjs-search .gridjs-...
2
votes
2
answers
138
views
Sorting by integer column doesn't sort by amount. Is it possible?
My data:
data: [
["A","2"],
["B","100"],
]
I was expecting it to sort by amount: 2 then 100, but it's the opposite. First row shows 100, second row ...
0
votes
1
answer
630
views
Refresh Gridjs Table on AJAX success
The AJAX code works fine and creates my desired outputs and on "success"
success: function (data) {
console.log(data);
$( "#gridjs_table" ).load(window.location.href + &...
0
votes
1
answer
911
views
gridjs - how to load from HTML
I have an existing HTML table. I'd like a thin JS library to add simple search and sorting. GridJS looks promising, but I don't understand the docs for loading from HTML. For example, I'm unable to ...
0
votes
0
answers
259
views
react gridjs addEventListener to TD element triggers more than once
I am trying to render a table using gridjs under react and attach an eventListener to tables cells. My code is partially working, but when I click a given cell, I got repeated events, probably one for ...
1
vote
1
answer
1k
views
How to custom GridJs pagination with supabase?
I'm software engineer in Cambodia.
I want to custom Grid.js pagination with supanase, but I faced a problem.
I don't know the solution because it's not in the documentation.
I'm using Nuxt 3
Please ...
1
vote
1
answer
203
views
Show Hide column and reorder GridJS
I configured Gridjs for datatables
is there any solution/ option to show/hide column for the final user and also reorder the columns?
Thanks
Bye
0
votes
2
answers
1k
views
How to add dark theme for `gridjs`
I am currently developing a single site that is in a dark theme and using gridjs to display data in a table. The problem is that the official settings are on the light theme and it seems that there is ...
0
votes
1
answer
922
views
Triggering a sort on Grid.js programmatically
When I mount the GridJS component and load its data, how can I programmatically trigger the default sort on load? What methods I should call?
I am using gridjs-svelte, but that really does not matter ...
0
votes
0
answers
503
views
react-dom.development.js:26091 Uncaught (in promise) Error: Target container is not a DOM element. at Object.render Using gridjs-react
I am developing an app with React and I use gridjs-react in it to display a list of affiliates, but I have this problem.
Uncaught (in promise) Error: The target container is not a DOM element.
at ...
1
vote
2
answers
8k
views
Module not found: Error: Can't resolve existing module
I am importing two modules from the same package.
import { RowSelection } from "gridjs/plugins/selection";
import { Grid } from "gridjs";
I can access RowSelection in VSCode (e.g. ...
0
votes
1
answer
2k
views
How can i set a button?
Im table using gridjs first time and im newbie at js items. How can i set a button? and how can i get link it?
<script>
new gridjs.Grid({
columns: ["#ID", &...
0
votes
0
answers
131
views
setState in React no working inside event gridjs
I am working with the gridjs library, which has a click event, when modifying a state it does not do so. any idea what it could be?
componentDidMount() {
this.consultaAPI();
localStorage....
0
votes
1
answer
1k
views
Gridjs pagination and sort with server side parameters
i use gridsjs sort and paginaton server side config, when i use for pagination its work perfectly, but for sorting the params not work properly like this http://scrum.test/api/customers&sort_by=id&...
0
votes
0
answers
417
views
How to add filters (server-side) with GridJS
I want to know, how I can add filters in GridJS to filter data from the server, I have a dropdown list of filters above the table. I want that when someone clicks on a particular filter the table ...
0
votes
0
answers
190
views
How can i array to grid table in Django HTML?
I can send my model to the html page and bring it to the array structure, but I cannot integrate this array into the grid table. Does anyone know how I can do this?
views.py
def tests(request):
...
1
vote
1
answer
748
views
Change the "No matching records found" message in Gridjs gridjs-react
I am using gridjs-react library and cannot customize the "No matching records found" message.
I have been able to customize many parts of gridjs like this:
style={{
td: {
...
0
votes
1
answer
1k
views
gridjs: server, how to map data for a simple json array
I'm a java-script newbee, that's why I struggle with the mapping of a simple json array, if it is a response from a server. I've tested it with static json, and it works as expected:
new gridjs....
1
vote
0
answers
663
views
Creating a Filter Button in GridJS
I am new to gridjs and am struggling to find a way to add filter buttons. I am looking to add dropdown selectors or buttons that will filter out entire rows if a specified value is not in a specified ...
0
votes
1
answer
1k
views
Toggle Select All not working for grid.js
I have a grid js defined as follows. I have select all check box on which I want to select/deselect all the rows. I am able to perform select all but deselect all does not work. Can anyone please help....
4
votes
0
answers
299
views
repopulating data in table #gridjs
so i know the updateConfig() / forceRender() methods in gridjs, but is it possible to workaround the 'redrawing table'? I'm looking for a function/method that repopulate tables data with persisting ...
1
vote
0
answers
436
views
Grid.js error seen in tests but not full application
I'm hoping you can help me figure out a puzzling error I see when testing. I should preface this question with the fact I'm not the worlds greatest js dev.
I've created an application using the react ...
0
votes
1
answer
241
views
Workaround to XHR request and download prohibition
I have a weird situation:
I get data from a Postgres database, and from that data, I create a table in a website, using Grid.js. Each line has a "Download" button, that takes 2 arguments ...