Can I limit form responses to one per user?
Create an endpoint to check whether the target user has already submitted a response, and switch the frontend display based on the response accordingly.
Example settings
Endpoint
Create the following endpoint in the Kuroco management screen. If there is no response, the response of pageInfo.totalCnt
will be 0.
Item | Setting |
---|---|
Path | check_answer |
Category | Form |
Model | InquiryMessage |
Operation | List |
inquiry_id | Target form ID |
self_only | Check the box |
cnt | 1 |
Example of frontend code
Hide form items when the user has already submitted a response
For example, if you write the following code, the form items will not be displayed if the user has already submitted a response.
<template>
<div>
<div v-if="hadSubmitted.pageInfo.totalCnt == 0">
<form>
・・・
Display form items here
・・・
</form>
</div>
<div v-else>
The response has already been submitted.
</div>
</div>
</template>
<script>
export default {
async asyncData({ $axios }) {
return {
response: await $axios.$get('/rcms-api/1/inquiry/1'),
hadSubmitted: await $axios.$get('/rcms-api/1/check_answer'),
};
},
methods: {
async handleOnSubmit() {
・・・
Submit the form here
・・・
}
}
};
</script>
Disable submit button when the form has been answered
To disable the form submit button when the form has been answered but keep the form items displayed, modify the button section as follows:
<template>
<div>
<form>
<!-- ... -->
<!-- display form items ... -->
<!-- ... -->
<button v-if="hadSubmitted.pageInfo.totalCnt == 0" @click.prevent="handleOnSubmit">
Submit
</button>
<button v-else disabled>
Answered
</button>
</form>
</div>
</template>
<script>
export default {
async asyncData({ $axios }) {
return {
response: await $axios.$get('/rcms-api/1/inquiry/1'),
hadSubmitted: await $axios.$get('/rcms-api/1/check_answer'),
};
},
methods: {
async handleOnSubmit() {
<!-- ... -->
<!-- form submission process ... -->
<!-- ... -->
}
}
};
</script>
Return an error when the form is already answered during form submission
To check for double answers when submitting the form, modify the code as follows:
<template>
<div>
<form>
<!-- ... -->
<!-- display form items ... -->
<!-- ... -->
</form>
</div>
</template>
<script>
export default {
data() {
return {
error: null,
}
},
async asyncData({ $axios }) {
return {
response: await $axios.$get('/rcms-api/1/inquiry/1'),
};
},
methods: {
async handleOnSubmit() {
const hadSubmitted = await this.$axios.$get('/rcms-api/1/check_answer')
if (hadSubmitted.pageInfo.totalCnt == 0){
<!-- ... -->
<!-- form submission process ... -->
<!-- ... -->
}
else{
this.error = "Already answered";
}
}
}
};
</script>
Related documentation
Support
If you have any other questions, please contact us or check out Our Slack Community.