Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.
Hi, at the moment if I send an axios post trb to refresh the page so I can see the data. How can I do it in the best way possible so as not to refresh the page when posting data? I don't use it in a form, I have a button after which I put a value.
<button type="button" v-on:click="add(data.id)">ADD</button>
data() {
return {
data[],
}
},
add(id) {
axios.post('add/' + id)
.then(() => {
this.Data()
})
},
I now call the data view function but how could I give a then response? I would like something cleaner
Don't know what your controller is returning, but you simply need to assign the response of it to your data:
data () {
return {
data: []
}
},
methods: {
add (id) {
axios.post('add/' + id)
.then((response) => {
this.data = response // if your actual data is somehwat wrapped, make sure you do the same here
})
},
}
<template>
<button type="button" v-on:click="add(data.id)">ADD</button>
</template>
<script>
export default {
data () {
return {
data: null
}
},
methods: {
add(id) {
axios.post('/add/' + id).then(response => (this.data = response))
}
}
}
</script>
I tested this method, but it will not work. I practically in that data array, save the data and notify them in view using a forum in a list
<li v-for="dt in data" :key="dt.id" class="list-group-item">
{{ dt.ype }}
<br>
<button type="button" v-on:click="add(dt.id)">Add</button>
<br>
<span class="badge badge-primary"><strong>{{ dt.results }}</strong></span>
</li>
I am not sure what this means. Maybe try to put all of the code you are using
He or she is using axios. Make sure to set this.data = response.data.
Could you do a console.log(response) inside of your then() and show what's printed out in your browsers console?
Please or to participate in this conversation.