table-editor giving the row an id


Topic: table-editor giving the row an id

smachesney asked 3 years ago

Hi - I would like to give each row in the table an id so when I update a value I can grab the row Id and use it to update the backend.

Also how do I give a column/ row input a class?


Michał Duszak staff commented 3 years ago

You can, for example, get a certain row by the content you've provided. I have made a snippet for you, where I got all the cells, then I found the first cell with the content of "Tiger Nixon", then I refered to it's parentNode, so that I could give it a class "custom-class":

https://mdbootstrap.com/snippets/standard/m-duszak/3281141#js-tab-view


smachesney commented 3 years ago

Hi

When loading my data in dynamically from the back end I would like to assign each row with it's reference id or even each cell a reference id - how do I do this?

It will take too long to load the data in, then go through each row based on content to assign an id


Michał Duszak staff commented 3 years ago

Hi, it's possible to use HTML when initiating a Datatable via JS. Simply use HTML syntax when defining cell's values

https://mdbootstrap.com/snippets/standard/m-duszak/3285332#css-tab-view


smachesney commented 3 years ago

Thanks Michal, I feel we're closer however by using that solution when the row is edited it messes up the functionality as you can see the arrow marks and span tags in the input field by setting the span tag inn the input value

I need to have an id on each row or each cell, but also be able to edit it without this being hindered.


Michał Duszak staff commented 3 years ago

Table editor plugin provides feature in which you can edit certain rows:

https://mdbootstrap.com/docs/standard/plugins/table-editor/

If it comes to Datatables again, rows are rerendered each time they get updated/edited/sorted/searched/pagination was used. You can reassign the ID's, but then we must go back to the first approach which forced us to iterate through each row and define ID by the contents. Maybe basic tables? You can define an ID or class from your HTML https://mdbootstrap.com/docs/standard/data/tables/#section-basic-example


smachesney commented 3 years ago

I'm very sorry but I feel like you are not understanding me, maybe my fault, maybe not.

The whole reason I wanted to use the plugin instead of basic tables was to be able to edit it on the fly.

I find that crazy that I can't tie an id reference to a row so when it gets updated I know which record on the database to update instead of looking for a record on the database whose fields match every one of the edited row's fields.

If I do what you say and assign a cell an id, then when I edit it the tag is in the input field rather then just the value...it doesn't work

I would highly recommend expanding this feature to allow a custom id to be placed on a cell or a row.


Michał Duszak staff commented 3 years ago

You can try get those values by private member _rows. Their indexes doesnt change if you sort/search, the data changes in the fly. Try to click the button on the bottom after editing some values.

https://mdbootstrap.com/snippets/standard/m-duszak/3288354#js-tab-view


smachesney commented 3 years ago

Thank you Michal, I feel like I can make that work by storing indexes & ids in a global variable for reference


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Resolved

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: MDB Standard
  • MDB Version: MDB5 3.9.0
  • Device: desktop
  • Browser: Chrome
  • OS: windows
  • Provided sample code: No
  • Provided link: No