CODEWITHSUNDEEP
javascriptjqueryhtmldatatable
Kyle Quigley
Kyle Quigley

Reputation: 1

Datatables Column Search/Filter - Double click required to open hyperlinks

I am using the following Datatable example, with the addition of some hyperlinks: Datatable Column Filter

Example of hyperlink code added - <td><a href="link.html">Tiger Nixon</a></td>

Steps:

  1. Search/Filter any column in the table.
  2. Click on a hyperlink. -> nothing happens. (linked page should open)
  3. Click on a hyperlink again. -> linked page opens.

After using the column filter, I need to un-focus the column filter by clicking within the table rows, then I can click on the hyperlink.

Question: Can this be fixed so only one click is needed?

Further info:

This looks to be a similar issue to mine but not similar enough to fix my problem:

DataTables Column Filter Strange Behaviour

Upvotes: 0

Views: 1084

Answers (2)

user8088462
user8088462

Reputation:

The following code should be an easy solution to your question:

$("#example tfoot input").on('keyup change', function(event) {
    table
      .column( $(this).parent().index()+':visible' )
      .search( this.value )
      .draw();
    event.target.blur();
});

Reference: https://datatables.net/release-datatables/extensions/ColReorder/examples/initialisation/col_filter.htmll

Upvotes: 1

Fabio Lolli
Fabio Lolli

Reputation: 889

I had the same problem too, my advice is to use something like

$(elementUsedAsFilter).blur();

in your change (or whatever) event handler. .blur() removes focus from the handler, after that you should be good to go! I think you should be able to get elementUsedAsFilter from the handler you used.

Upvotes: 0

Related Questions