It works now, thanks for your help!

Sweet, thanks! Looking forward to 0.15!

Hi there,

I’ve been implementing a few data tables in my app and one common request I get is for the search to take into account or ignore accented characters.

So for example, if I have a line that says “métal”, our user wants to just type “metal” and would like for it to show up even though the spelling is not identical.

My problem isn’t in the implementation of that rule but rather if there’s any way to implement a more customized search (fuzzy search for example) in the search bar without having to create a manual filter above the table that would look a bit clunky.

I guess I could add an invisible column with equivalent data stripped from accents and special characters and search on that but I find this a bit hack-ish.

Thanks!

It works now, thanks for your help!

Seems like it does : <a href="#/clients/5/details" class="router-link-exact-active open active">test</a>.

Strange thing is, here is the generated HTML when I access the page directly :

<div class="q-tab column flex-center relative-position router-link-exact-active open active icon-and-label text-tertiary"><i aria-hidden="true" class="q-tab-icon q-icon material-icons">aspect_ratio</i><span class="q-tab-label">Client Details</span> <!----><div class="q-tabs-bar" style="display: none;"></div></div>

And this is when I manually click on the tab :

<div class="q-tab column flex-center relative-position router-link-exact-active open active active icon-and-label text-tertiary"><i aria-hidden="true" class="q-tab-icon q-icon material-icons">aspect_ratio</i><span class="q-tab-label">Client Details</span> <!----><div class="q-tabs-bar"></div></div>

Seems like the first one is setting display: none to the div with the q-tabs-bar class?

Thanks for the quick reply!

Just tried without params (I actually removed them everywhere just for the test) and it doesn’t seem to work either.

Hello, I’m trying to use routed QTabs and I’m having an odd issue. It might be me not understanding routing very well so here goes: When I click on a tab, everything works fine and my view shows up, the URL changes and the tab is selected. However, if I access the tab’s URL directly, when the page loads, the correct view shows up but no tab is selected. I’m not sure what, if anything, I’m doing wrong.

Here is the related code :

router.js

{
              path: '/clients/:id',
              name: 'ClientView',
              component: ClientView,
              children: [
                {
                  path: '/clients/:id/dashboard',
                  name: 'ClientViewDashboard',
                  components: { ClientViewTabs: ClientViewDashboard }
                },
                {
                  path: '/clients/:id/details',
                  name: 'ClientViewDetails',
                  components: { ClientViewTabs: ClientViewDetails }
                }
              ]
}

And my tabs :

<template>
  <q-tabs>
    <q-route-tab :to="{name: 'ClientViewDashboard', params: {id: 5}}" slot="title" label="Dashboard" />
    <q-route-tab :to="{name: 'ClientViewDetails', params: {id: 5}}" slot="title" label="Details" />

    <router-view name="ClientViewTabs"></router-view>
  </q-tabs>
</template>

Am I missing something…?