Creating a search form that either returns results to view or xlsx

I'm banging my head on the wall for two days on this one, so any help would be really appreciated.

So I have a search form that returns the results to the view just fine. But now I want to add a button, that when clicked, returns the results in an excel file.

The solution I'm trying is creating an "export" button with a Vue component, that when clicked, adds a hidden input to the DOM, then submits the form after a .5 second delay. If the controller sees that input, it should return the excel file; if not, result the view with results. I basically want to use the same exact query function to keep things simple.

The problem is that I can't remove or change that hidden input after the button click. I've tried adding another delay and setting the value to something else, but it won't update.

Is there a better way to do this? Or am I missing some fundamentals with how buttons and forms work on the DOM?

Thanks.

View:

  <user-export-button></user-export-button>
  <button type="submit">Search</button>

Vue:

<template>
  <div>
    <input type="hidden" name="exportUsers" v-model="exportUsers">
    <button type="button" @click="clicked()">Export</button>
  </div>
</template>

<script>
export default {
  name: 'user-export-button',

  data(){
    return {
      exportUsers: null,
    }
  },

  methods: {
    clicked() {

      this.exportUsers = 'exportUsers'
      setTimeout( function() {
        document.getElementById('form').submit();
      }, 500)
      setTimeout( function() {
      this.exportUsers = null;
      }, 1000)
    }
  
  }

}
</script>

Controller:

 if($request->exportUsers == 'exportUsers')
{
    return Excel::download(new UsersExport($users), 'users.xlsx');
}
else 
{ 
    return view('admin/users', ['users' => $users]); 
}