No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    QTable with multiple selection and QPopupEdit

    Help
    5
    16
    5441
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • metalsadman
      metalsadman last edited by metalsadman

      @Mak-NOAA your rowSelected property must be initiated first on your data array. ie. ... data:[ { ..., // your other fields rowSelected: false } ]. I suggest not using selected tho, since it’s being used internally by QTable.

      1 Reply Last reply Reply Quote 0
      • M
        Mak-NOAA last edited by

        @metalsadman I tried to add
        trip.rowSelected = false
        below the following line (where I retrieve the data):
        https://github.com/nwfsc-fram/boatnet/blob/master/apps/obs-web/src/views/DebrieferTrips.vue#L402

        however the boxes are still checked. I’m sure there’s an obvious bug there, can you please have a look?

        I was using “selected” to figure out which column cells were selected as I have a dialog box that needs to allow the user to edit the cells selected.

        1 Reply Last reply Reply Quote 0
        • metalsadman
          metalsadman last edited by metalsadman

          @Mak-NOAA
          just change your checkbox.

          <q-td auto-width>
             <q-checkbox dense v-model="props.selected" />
          </q-td>
          

          selected is exposed by your slot’s props in your case the body https://quasar.dev/vue-components/table#QTable-API you can check the full properties there.
          when a row is selected, then it will be stored in your rowSelected array and be sure that what you passed in your QTables prop row-key="id" is a prop in your row (does id exist in your row and is it unique?).

          C 1 Reply Last reply Reply Quote 1
          • M
            Mak-NOAA last edited by Mak-NOAA

            @metalsadman I changed the checkbox to <q-checkbox dense v-model=“props.selected” /> but what happened was that all rows get selected now if I select any checkbox.
            Screen Shot 2019-07-01 at 10.53.21 AM.png

            Are you saying for my own array for column cell selection, I should not use “selected” as it’s reserved by the framework?

            1 Reply Last reply Reply Quote 0
            • metalsadman
              metalsadman last edited by

              @Mak-NOAA i think the issue here is the row-key, try giving it the __index ie row-key="__index".

              1 Reply Last reply Reply Quote 0
              • M
                Mak-NOAA last edited by

                @metalsadman yes that fixed it, thank you!

                Sorry I’m new to Quasar but can you explain more about what just happened? 🙂

                1 Reply Last reply Reply Quote 0
                • lucasfernog
                  lucasfernog last edited by

                  @Mak-NOAA

                  https://quasar.dev/vue-components/table#Selection

                  its a good idea to read the doc page of the component you are trying to use, so you can learn what he can do and how you should do it.

                  https://quasar.dev/vue-components/table#QTable-API

                  1 Reply Last reply Reply Quote 0
                  • lucasfernog
                    lucasfernog last edited by

                    By the way __index is not so good because it is private (everything starting with __ is private), its better if your data has an unique value such as id

                    1 Reply Last reply Reply Quote 0
                    • M
                      Mak-NOAA last edited by

                      Thanks @lucasfernog looks like row-key=“key” was needed as that was my unique identifier

                      1 Reply Last reply Reply Quote 1
                      • C
                        cynderkromi @metalsadman last edited by

                        @metalsadman This worked for me thanks!

                        1 Reply Last reply Reply Quote 0
                        • First post
                          Last post