Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

183
Views
How to search through dynamic table vuejs?

So I am creating tables in vue using loops, i.e. anyone can upload a table and view it.

<el-table :data="filtered"  border style="width: 100%" height="500" @selection-change="handleSelectionChange" @header-click="contextmenu">
  <el-table-column type="selection" width="55"/>
  <el-table-column  fixed v-for="col in columns" :prop="col.field" :label="col.field" :key="col.field"/>
  <el-table-column>
    <template #header>
        <el-input v-model="searchQuery" size="small" placeholder="Type to search" />
      </template>
      <template #default="scope">
        <el-button size="small" type="danger" @click="handleDelete(scope.$index, scope.row)">Delete</el-button>
      </template>
    </el-table-column>
  
  </el-table>
  <el-button type="warning" round v-on:click="getdata(selected_data,source)">Update-Data</el-button>
</div>

I and trying to implement a search feature that is dynamic, i.e. it can search through all the columns of any table uploaded by user. I saw some solutions online but they are for fixed tables. I also tried writing a loop and returning the data

computed: {
    filtered (){
      if(this.searchQuery){
      return this.d.filter((item)=>{
        for(let i=0;i<this.columns.length;i++){
          const x=this.columns[0].field //I have an array columns which has all the columns inside 
                                          //of it in a dictionary
          console.log(item.x.startsWith(this.searchQuery)) //this gives an error *Cannot read 
                                                             //properties of undefined (reading 
                                                             //'startsWith')*
        }
        return item.Name.startsWith(this.searchQuery); // and this line works perfectly fine, if I  
                                                          //the table has a column named **Name**
      })
      }else{
        return this.d; //d is the data array
      }
    }
  }

Is there a way I can search through all the columns of any table uploaded by the user? Any suggestions are greatly appreciated.

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

I solved it by using item[x] instead of item.x.

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!