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

    Dynamic checkbox

    Framework
    3
    5
    743
    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.
    • I
      igor_local last edited by

      Hi everybody!
      I have a dynamic list of users, which I get using the directive v-for. This list includes the checkboxes. If I pointed out one - all checkboxes are selected.
      My questions is: how can i deselect only one checkbox, bounded to userId for example?
      Thank you!

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

        Hi @igor_local with your code, it’s more easier 😉

        globaly, if all your checkbox are the same data, you cant have the behavior you expect.

        if your v-for point on an array of object, your checkbox must to point on a data of your object

        for exemple:

        in your data
        posts: [
        { id: 1, title: ‘my first title’, check: false},
        { id: 2, title: ‘my second title’, check: false},
        …
        ]

        in your template:
        <div v-for="(post, i) in posts">
        {{ post.title }}
        <q-checkbox v-model=“post.check” />

        I 1 Reply Last reply Reply Quote 0
        • I
          igor_local @Shoooryuken last edited by

          @Shoooryuken
          Thank you for your answer!
          I think my case is a little more complicated. I get data from server that is storing into empty array. It looks like this:
          The data from server:
          {
          [user: ‘John Lennon’, userId: ‘53d879b2-c44c-11e7-9456-002590c134db’],
          [user: ‘Paul McCartney’, userId: ‘c8faace9-b24e-47af-8f64-1ea9e30ae8c0’],
          [user: ‘Ringo Starr’, userId: ‘70d9fec0-8c8b-446c-bd6b-8460aa5c1679’],
          [user: ‘George Harrison’, userId: ‘d00d9bad-7f74-4e66-8ddc-071bf37da0f0’]
          }

          this.objects = data

          in my data
          objects: []

          in my template:
          <div v-for="(item, i) in objects">
          {{ item.user }}
          </div>

          So, how do i insert this v-model into an empty array?
          <q-checkbox v-model=“post.userId” />

          thank you!!

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

            @igor_local pls make a working reproduction codepen, also use unique keys if you are using v-for. ie :key="item.userId".

            I 1 Reply Last reply Reply Quote 0
            • I
              igor_local @metalsadman last edited by

              @metalsadman , sorry, i was very busy these days.
              So, i tried to outline the problem that I’m solving:
              https://codesandbox.io/s/recursing-cdn-dqnp7
              i want to uncheck one of the items (one, or two, any) and so that this item is not copied into another array when copying (by clicking the button ‘Copy to Another Array’).

              Thank you! Hope i explained clearly…

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