@walfin you are brilliant! Thank you so much. This one has been bugging me for so long
Finally fixed and working great! Also, the div trick was something I didnāt pick up either!
Latest posts made by effiestar
-
RE: Odd/Even Table Row Colours
-
RE: Odd/Even Table Row Colours
Hey @walfin !
Iāve removed the extra
:props
the other errors are now gone, but the tables are still not returning alternate colours. Doesnāt seem to be a fan of the below:<q-tr :class="(props.rowIndex==%2)===0?'bg-grey':'bg-white'" > <q-td v-for="col in props.cols" :key="col.name" >
-
RE: Odd/Even Table Row Colours
Hey @walfin thanks for helping! - I tried this option with my current code, but it is still returning an error
<q-tr :props="props" :class="(props.rowIndex==%2)===0?'bg-grey':'bg-white'" > <q-td v-for="col in props.cols" :key="col.name" :props="props" > {{ col.value }} </q-td> <q-td auto-width> <q-btn size="sm" color="positive" round dense @click="props.expand = !props.expand" :icon="props.expand ? 'remove' : 'add'" /> </q-td> </q-tr> <q-tr v-show="props.expand" :props="props"> <q-td colspan="100%"> <div class="q-pa-dense q-gutter-md bg-white" style="inline" > <q-btn outline style="color: grey; inherit" label="Button 1" @click="moreinfo(props.row)" /> <q-btn outline style="color: grey;" label="Button 2" /> <q-btn outline style="color: grey;" icon="history" /> <q-btn outline style="color: grey;" icon="report_problem" /> </div> </q-td> </q-tr> </template>
This is my current code but it is still returning the following error, plus a couple of others regarding whitespace which hadnāt popped up before.
-
Odd/Even Table Row Colours
Hello all!
Iām very new to Quasar & Coding in general (Just an FYI as Iām still mixing u my terminology, so sorry in advance).
Iām building a table that pulls info from a database of parts. However, to make it visually easier to read, Iām wanting to colourise the rows in grey & white. Iām having trouble figuring out how to do this given the different tables could have any number of rows?
Additionally, they also have an expanding button in each row which clicks open to display āmore infoā buttons:
<q-btn size=āsmā color=āpositiveā round dense @click=āprops.expand = !props.expandā :icon=āprops.expand ? āremoveā : āaddāā />
I want the expanded rows beneath the item to stay white while the main rows are odd/even in colour:
Could someone please help with a solution? Thank you!