Please help. I have been using Vue Tables 2 for > 2 years now, and I have never had this problem. My table shows up perfectly as usual, but now whenever I click on a cell, it is surrounded by a blue outline on chrome and a dotted outline on firefox. It is exhibiting the same behavior as if I had clicked on an input. I went through my Vue Tables 2 options one by one, disabling each in turn and it did not change the behavior. I looked through bootstrap 4 tables documentation, and could not find the same behavior as a option, so i believe it is vue tables that is doing it. The demo fiddle on the Vue Tables 2 page also has this behavior. It is very distracting and I am trying to get it to stop.
My goal is to have the table show the behavior it has before, which is to do nothing when you click on a cell.
I am using Bootstrap 4.4, and Vue-Tables-2 version 1.6.25
My options array looks like so
tableOptions: {
skin: 'table table-sm table-hover border-0',
filterable: true,
pagination: { chunk:4 },
perPageValues: [],
perPage: 18,
dateColumns: ['created_at'],
dateFormat: 'MM-DD-YYYY',
toMomentFormat: 'YYYY-MM-DD H:mm:ss',
texts:{
filter:"",
count:"",
filterPlaceholder:"Search",
page:"Page:",
noResults:"No matching records",
loading:'Loading...',
},
columnsClasses: {
cntCnt: 'text-center noOutline',
qtCnt: 'text-center noOutline',
statusName: 'text-center noOutline',
created_at: 'text-center ',
},
headings: {
id: 'Ref',
name: 'Name',
cntCnt: 'Contacts',
qtCnt: 'Quotes',
statusName: 'Status',
created_at: 'Created',
orgSelect: '',
},
}
I have added a picture that shows whats going on.The outline is arouns any and every cell I click, including the column headers.