Search code examples
vuejs2vue-tables-2

get data of slected row in vue good table


guys, I m new to vue so don't know how to achieve following situation enter image description here how i can get data of current selected row here is code

       <div class="table-responsive-sm">
                     <vue-good-table
                     title="Page List"
                     :columns="columns1"
                     :rows="rows1"  
                     :paginationOptions="{enabled: false}">
                      
                       <template slot="table-row-after" slot-scope="props" >
                          <td class="fancy"><input type="checkbox" v-model="checkview[props.row.originalIndex]">
                           </td>
                          <td class="has-text-right"><input type="checkbox" v-model="checkedit[props.row.originalIndex]"></td>
                          <td class="has-text-right"><input type="checkbox" v-model="checkupate[props.row.originalIndex]"></td>
                          <td class="has-text-right"><input type="checkbox" v-model="checkdelete[props.row.originalIndex]"></td>
                       </template>
                  </vue-good-table>
      columns1: [
    {
      label: 'Page Name',
      field: 'pagename',
       sortable: false,
    },
     {
      label: 'View',
       sortable: false,
    },
     {
      label: 'edit',
       sortable: false,
    },
    {
      label: 'update',
      sortable: false,
    },
     {
      label: 'delete',
      sortable: false,
    },

  ],
   rows1:[],
 methods:{
               getTotals1(){
            var self = this;
            this.$http.get('http://localhost:3000/api/permissionpgs')
            .then(function (response) {
              console.log(response.data)
                 self.rows1 = response.data;      
            })
        },
 }

is there any way to get data of value when save method got trigger. last ting this is vue good table


Solution

  • you're storing the values of checked items in 3 different objects. checkedit, checkupdate and checkdelete. If the user checks/unchecks your checkboxes in the table. These objects will have the following form:

    checkupdate{
      2: true, // index of the row: whether checked or unchecked
      5: false,
      20: true
    }
    now to get the rows for each of these objects all you have to do is loop through the object properties, collect the index that has value as true. then do this.rows1[index] to get the actual row object.