How to get datatable to select/highlight from external selection without setting focus on datatable?
How to get datatable to select/highlight from external selection without setting focus on datatable?
elijah71
Posts: 4Questions: 1Answers: 0
I've been on and off this topic searching for a few days now.
What I'm doing is the following.
I have the DataTable and a Map on my UI. The DataTable lists the data points that are on the Map.
I can select and multi select on the DataTable, which highlights the row on the data table and interacts with the map and plots highlighted data points just fine.
The issue that I'm having is that when I use the map to select the DataTable does not reflect the selected row that goes with that data point on the map UNTIL I mouse over the DataTable which I'm assuming in the background triggers some sort of refresh. I don't have to click or do anything in the DataTable , it just automatically triggers itself and then shows all of the points that I selected within my map.
The variable that the html page to is being properly called and its value is being set, it just does not reflect the highlights on the rows until the mouse enters the DataTable area.
So my question is HOW DO I GET the DataTable to auto display when I make my external selection?
I don't want to DROP the table and Redraw it as it would not create a good UX.
Appreciate any and all input on this.
Answers
"I don't want to DROP the table and Redraw it as it would not create a good UX."
Redrawing doesn't mean you have to drop the table. But redrawing it might indeed be the solution. I would give it a try.
https://datatables.net/reference/api/draw()
"table.draw( false )" might be the right option.
And of course you can just trigger mouseover for the data table when changing your map.
https://stackoverflow.com/questions/15350603/how-to-trigger-mouseover-function-on-an-element-when-not-really-mouseovered
I've spent hours now trying to follow the draw() and triggering the mouseover. I cannot get anything to trigger it.
The redraw only has Javascript examples and I'm using Angular. Are you able to provide any other links? I cannot find anything and feel like I'm wasting time spinning my wheels on this.
Seems odd that when using
select()the row isn't selected until you mouse over it. Datatables should select the row whether in focus or not. See this simple example:http://live.datatables.net/kacerule/1/edit
Click on a row in the first table and the corresponding row in the second will be selected.
Can you link your page or provide a test case showing the issue?
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case
Kevin
Got a solution to the issue from StackOverflow.
https://stackoverflow.com/questions/60599248/how-to-get-datatable-to-select-highlight-from-external-selection-without-setting/60686903?noredirect=1#comment107463077_60686903