SilverShade
SilverShade
Explore posts from servers
NNuxt
Created by SilverShade on 4/20/2024 in #❓・help
Form data reset in <input /> tags
I have the following form: I want the data that the user inputs in the "input" tag fields to reset when the user leaves the page or submits the form. How do i do that?
<form @submit.prevent="purchase">
<div class="input-wrapper">
<input class="form-headline" :value="'Price: ' + paymentStore.price + ' $'" disabled />
</div>
<div class="input-wrapper">
<input class="form-headline" :value="'Sessions number: ' + paymentStore.sessionsNum"
disabled />
</div>
<div class="input-wrapper">
<input class="input-value" placeholder="0000 0000 0000 0000" />
</div>
<div class="inputs-in-line">
<div class="input-wrapper">
<input class="input-value" placeholder="12/12" />
</div>
<div class="input-wrapper">
<input class="input-value" placeholder="000" />
</div>
</div>
<button class="cta-button">Pay</button>
</form>
<form @submit.prevent="purchase">
<div class="input-wrapper">
<input class="form-headline" :value="'Price: ' + paymentStore.price + ' $'" disabled />
</div>
<div class="input-wrapper">
<input class="form-headline" :value="'Sessions number: ' + paymentStore.sessionsNum"
disabled />
</div>
<div class="input-wrapper">
<input class="input-value" placeholder="0000 0000 0000 0000" />
</div>
<div class="inputs-in-line">
<div class="input-wrapper">
<input class="input-value" placeholder="12/12" />
</div>
<div class="input-wrapper">
<input class="input-value" placeholder="000" />
</div>
</div>
<button class="cta-button">Pay</button>
</form>
3 replies
NNuxt
Created by SilverShade on 4/14/2024 in #❓・help
Display HTTP POST response error in a component
Hey guys, i'm completely new to frontend development, so i need help with some basic stuff. I send a POST request to my backend API and i somehow need to handle the API response: On success i want to redirect the user to a different page, and on error i want to display the error in my component. How do i do that?
<template>
<div class="form-wrapper">
<div class="form">
<div class="content">
<div class="heading-1">Register</div>
<div class="inputs">
<form @submit.prevent="submitForm">
<div class="input-wrapper">
<input type="email" v-model="formData.email" id="email" class="input-value"
placeholder="Email" />
</div>
<div class="input-wrapper">
<input type="password" v-model="formData.password" id="password" class="input-value"
placeholder="Password" />
</div>
<div class="input-wrapper">
<input type="password" id="confirm-password"
class="input-value" placeholder="Confirm password" />
</div>

<button type="submit" class="cta-button">Register</button>
</form>
</div>
</div>
</div>
</div>
</template>

<script setup lang="ts">
import { ref } from 'vue'

definePageMeta({
layout: 'register'
})

const formData = ref({
email: '',
password: '',
})

const submitForm = async () => {
const config = useRuntimeConfig()
const data = await $fetch(config.public.apiBase + '/register', {
method: 'post',
body: {
"email": formData.value.email,
"password": formData.value.password
}
})
}

</script>
<template>
<div class="form-wrapper">
<div class="form">
<div class="content">
<div class="heading-1">Register</div>
<div class="inputs">
<form @submit.prevent="submitForm">
<div class="input-wrapper">
<input type="email" v-model="formData.email" id="email" class="input-value"
placeholder="Email" />
</div>
<div class="input-wrapper">
<input type="password" v-model="formData.password" id="password" class="input-value"
placeholder="Password" />
</div>
<div class="input-wrapper">
<input type="password" id="confirm-password"
class="input-value" placeholder="Confirm password" />
</div>

<button type="submit" class="cta-button">Register</button>
</form>
</div>
</div>
</div>
</div>
</template>

<script setup lang="ts">
import { ref } from 'vue'

definePageMeta({
layout: 'register'
})

const formData = ref({
email: '',
password: '',
})

const submitForm = async () => {
const config = useRuntimeConfig()
const data = await $fetch(config.public.apiBase + '/register', {
method: 'post',
body: {
"email": formData.value.email,
"password": formData.value.password
}
})
}

</script>
3 replies
CC#
Created by SilverShade on 2/20/2024 in #help
ThreadPool implementation with WSQ
I'm trying to implement a simple version of ThreadPool with work stealing queues. It seems like i'm missing something, but can't see what. My implementation with WSQs is actually slower than without them. The implementation of a work stealing queue (WorkStealingQueue class) was provided for me, so you can assume it's not the issue. I'll provide my code in the messages below.
3 replies