wip
Subhodip Ghosh 2023-05-07 20:29:00 +05:30
parent 52e0800ce7
commit 75a91cc670
3 changed files with 78 additions and 70 deletions

View File

@ -10,7 +10,10 @@ export default function addSchoolForm() {
"status":"published", "status":"published",
name: event.target.schoolName.value, name: event.target.schoolName.value,
country: event.target.country.value, country: event.target.country.value,
anual: event.target.anual.value,
toddlers: event.target.toddlers.value,
early_start_programme: event.target.early_start_programme.value,
interakto: event.target.interakto.value,
} }
const JSONdata = JSON.stringify(data) const JSONdata = JSON.stringify(data)
const endpoint = 'https://management.beanstalkedu.com/items/school' const endpoint = 'https://management.beanstalkedu.com/items/school'
@ -23,8 +26,8 @@ export default function addSchoolForm() {
} }
const response = await fetch(endpoint, options) const response = await fetch(endpoint, options)
const result = await response.json() // const result = await response.json()
alert(`Is this your full name: ${result.data}`) // alert(`Is this your full name: ${result.data}`)
} }
return ( return (
<main> <main>
@ -39,7 +42,7 @@ export default function addSchoolForm() {
<form onSubmit={handleSubmit} className='w-full px-6 md:px-20'> <form onSubmit={handleSubmit} className='w-full px-6 md:px-20'>
<div className='flex flex-col w-full'> <div className='flex flex-col w-full'>
<label htmlFor="school" className='text-xl font-bold'>School Name</label> <label htmlFor="school" className='text-xl font-bold'>School Name</label>
<input type="text" name="schoolName" placeholder='School Name' className=' border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]' /> <input type="text" name="schoolName" placeholder='School Name' className='border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]' />
</div> </div>
<div className='flex flex-col w-full pt-4'> <div className='flex flex-col w-full pt-4'>
<label htmlFor="country" className='text-xl font-bold'>Country</label> <label htmlFor="country" className='text-xl font-bold'>Country</label>
@ -47,7 +50,7 @@ export default function addSchoolForm() {
</div> </div>
<div className='flex flex-col w-full pt-4'> <div className='flex flex-col w-full pt-4'>
<label htmlFor="anual" className='text-xl font-bold'>Anual</label> <label htmlFor="anual" className='text-xl font-bold'>Anual</label>
<select name="anual" className=' bg-white border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]'> <select name="anual" className=' bg-white border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]'>
<option value="0" selected>-Select-</option> <option value="0" selected>-Select-</option>
<option value="January">January</option> <option value="January">January</option>
<option value="February">February</option> <option value="February">February</option>
@ -65,25 +68,25 @@ export default function addSchoolForm() {
</div> </div>
<div className='flex flex-col w-full pt-4'> <div className='flex flex-col w-full pt-4'>
<label htmlFor="toddlers" className='text-xl font-bold'>Toddlers</label> <label htmlFor="toddlers" className='text-xl font-bold'>Toddlers</label>
<select name="toddlers" className=' bg-white border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]'> <select name="toddlers" className=' bg-white border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]'>
<option value="0" selected>-Select-</option> <option value="0" selected>-Select-</option>
<option value="January">January</option> <option value="January">January</option>
<option value="February">February</option> <option value="February">February</option>
<option value="March">March</option> <option value="March">March</option>
<option value="April">April</option> <option value="April">April</option>
<option value="May">May</option> <option value="May">May</option>
<option value="June">June</option> <option value="June">June</option>
<option value="July">July</option> <option value="July">July</option>
<option value="August">August</option> <option value="August">August</option>
<option value="September">September</option> <option value="September">September</option>
<option value="October">October</option> <option value="October">October</option>
<option value="November">November</option> <option value="November">November</option>
<option value="December">December</option> <option value="December">December</option>
</select> </select>
</div> </div>
<div className='flex flex-col w-full pt-4'> <div className='flex flex-col w-full pt-4'>
<label htmlFor="early_start_program" className='text-xl font-bold'>Early Start Program</label> <label htmlFor="early_start_programme" className='text-xl font-bold'>Early Start Program</label>
<select name="early_start_program" id="early_start_program" className='bg-white border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]'> <select name="early_start_programme" id="early_start_programme" className='bg-white border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]'>
<option value="0" selected>-Select-</option> <option value="0" selected>-Select-</option>
<option value="January">January</option> <option value="January">January</option>
<option value="February">February</option> <option value="February">February</option>
@ -118,7 +121,7 @@ export default function addSchoolForm() {
</select> </select>
</div> </div>
<div className='flex justify-center pt-8'> <div className='flex justify-center pt-8'>
<button type='submit' className='bg-[#FE4501] hover:shadow-2xl hover:shadow-[#F2B705] p-2.5 rounded-lg px-10 rounded-tl-full rounded-br-full hover:scale-110 active:scale-75 duration-200 text-xl font-bold text-white cursor-pointer'>Submit Now</button> <a href="/school-list"><button type='submit' className='bg-[#FE4501] hover:shadow-2xl hover:shadow-[#F2B705] p-2.5 rounded-lg px-10 rounded-tl-full rounded-br-full hover:scale-110 active:scale-75 duration-200 text-xl font-bold text-white cursor-pointer'>Submit Now</button></a>
{/* <input type="submit" value="Submit Now" className='bg-[#FE4501] hover:shadow-2xl hover:shadow-[#F2B705] p-2.5 rounded-lg px-10 rounded-tl-full rounded-br-full hover:scale-110 active:scale-75 duration-200 text-xl font-bold text-white cursor-pointer' /> */} {/* <input type="submit" value="Submit Now" className='bg-[#FE4501] hover:shadow-2xl hover:shadow-[#F2B705] p-2.5 rounded-lg px-10 rounded-tl-full rounded-br-full hover:scale-110 active:scale-75 duration-200 text-xl font-bold text-white cursor-pointer' /> */}
</div> </div>
</form> </form>
@ -127,5 +130,4 @@ export default function addSchoolForm() {
</div> </div>
</main> </main>
) )
} }

View File

@ -1,40 +1,38 @@
import React, { useState } from 'react'; // https://management.beanstalkedu.com/items/school
// import React from 'react';
import React, { useState, useEffect } from 'react';
import Image from 'next/image' import Image from 'next/image'
import NavBar from '../components/NavBar' import NavBar from '../components/NavBar'
import { Inter } from 'next/font/google' // import { Inter } from 'next/font/google'
export default function addUserForm (){
const inter = Inter({ subsets: ['latin'] }) const [school, setData] = useState("");
function Postformvalue(props) {
const [formvalue, setFormvalue]= useState({name:'',school:'', plan:'', class:'', lang:'', start_month:'', start_date:'', end_date:'', });
const handleInput =(e)=>{
const { name, value}= e.target;
setFormvalue({...formvalue, [name]:value});
console.log(formvalue);
}
const handleFormsubmit= async (e)=>{
e.preventDefault();
await fetch('http://localhost/devopsdeveloper/ReactFormvalue/', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
name:formvalue.name,
school: formvalue.school,
plan: formvalue.plan,
class: formvalue.class,
lang: formvalue.lang,
start_month: formvalue.start_month,
start_date: formvalue.start_date,
end_date: formvalue.end_date
})
});
console.log("success");
}
useEffect(() => {
fetch('https://management.beanstalkedu.com/items/school')
.then( (response) => response.json() )
.then( (data) => setData(data) )
}, []);
console.log(school)
const handleFormsubmit = async (event) => {
event.preventDefault()
const data = {
"status":"published",
user: event.target.user.value,
// user: event.target.user.value,
}
const JSONdata = JSON.stringify(data)
const endpoint = 'https://management.beanstalkedu.com/items/enrolled_user'
const options = {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSONdata,
}
const response = await fetch(endpoint, options)
const result = await response.json()
alert(`Is this your full name: ${result.data}`)
}
return ( return (
<main> <main>
<div> <div>
@ -47,16 +45,25 @@ const inter = Inter({ subsets: ['latin'] })
</div> </div>
<form onSubmit={handleFormsubmit} action="" className='w-full px-6 md:px-20'> <form onSubmit={handleFormsubmit} action="" className='w-full px-6 md:px-20'>
<div className='flex flex-col w-full'> <div className='flex flex-col w-full'>
<label htmlFor="name" className='text-xl font-bold'>User Name</label> <label htmlFor="user" className='text-xl font-bold'>User Name</label>
<input value={formvalue.name} onChange={handleInput} type="text" name="name" id="name" placeholder='ex. xyz@email.com' className=' border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]' /> <input type="text" name="user" id="user" placeholder='ex. xyz@email.com' className=' border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]' />
</div>
<div className='flex flex-col w-full pt-4'>
<label htmlFor="lang" className='text-xl font-bold'>School name</label>
<select name="lang" id="lang" className='bg-white border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]'>
{/* <option value="" selected>-Select-</option> */}
{/* {school.map(data=>
<option value="Bengali"></option>
)} */}
</select>
</div> </div>
<div className='flex flex-col w-full pt-4'> <div className='flex flex-col w-full pt-4'>
<label htmlFor="school" className='text-xl font-bold'>School Name</label> <label htmlFor="school" className='text-xl font-bold'>School Name</label>
<input value={formvalue.school} onChange={handleInput} type="text" name="school" id="school" placeholder='School Name' className=' border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]' /> <input type="text" name="school" id="school" placeholder='School Name' className=' border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]' />
</div> </div>
<div className='flex flex-col w-full pt-4'> <div className='flex flex-col w-full pt-4'>
<label htmlFor="plan" className='text-xl font-bold'>Plan</label> <label htmlFor="plan" className='text-xl font-bold'>Plan</label>
<select value={formvalue.plan} onChange={handleInput} name="plan" id="plan" className=' bg-white border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]'> <select name="plan" id="plan" className=' bg-white border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]'>
<option value="0" selected>-Select-</option> <option value="0" selected>-Select-</option>
<option value="Anual">Anual</option> <option value="Anual">Anual</option>
<option value="Early-Start-Program">Early Start Program</option> <option value="Early-Start-Program">Early Start Program</option>
@ -66,7 +73,7 @@ const inter = Inter({ subsets: ['latin'] })
</div> </div>
<div className='flex flex-col w-full pt-4'> <div className='flex flex-col w-full pt-4'>
<label htmlFor="class" className='text-xl font-bold'>Class</label> <label htmlFor="class" className='text-xl font-bold'>Class</label>
<select value={formvalue.class} onChange={handleInput} name="class" id="class" className=' bg-white border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]'> <select name="class" id="class" className=' bg-white border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]'>
<option value="0" selected>-Select-</option> <option value="0" selected>-Select-</option>
<option value="IK1">IK1</option> <option value="IK1">IK1</option>
<option value="IK2">IK2</option> <option value="IK2">IK2</option>
@ -76,7 +83,7 @@ const inter = Inter({ subsets: ['latin'] })
</div> </div>
<div className='flex flex-col w-full pt-4'> <div className='flex flex-col w-full pt-4'>
<label htmlFor="lang" className='text-xl font-bold'>Language</label> <label htmlFor="lang" className='text-xl font-bold'>Language</label>
<select value={formvalue.lang} onChange={handleInput} name="lang" id="lang" className='bg-white border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]'> <select name="lang" id="lang" className='bg-white border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]'>
<option value="" selected>-Select-</option> <option value="" selected>-Select-</option>
<option value="Bengali"> Bengali</option> <option value="Bengali"> Bengali</option>
<option value="English"> English</option> <option value="English"> English</option>
@ -92,7 +99,7 @@ const inter = Inter({ subsets: ['latin'] })
</div> </div>
<div className='flex flex-col w-full pt-4'> <div className='flex flex-col w-full pt-4'>
<label htmlFor="start_month" className='text-xl font-bold'>Start Month</label> <label htmlFor="start_month" className='text-xl font-bold'>Start Month</label>
<select value={formvalue.start_month} onChange={handleInput} name="start_month" id="start_month" className='bg-white border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]'> <select name="start_month" id="start_month" className='bg-white border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]'>
<option value="0" selected>-Select-</option> <option value="0" selected>-Select-</option>
<option value="January"> January</option> <option value="January"> January</option>
<option value="February"> February</option> <option value="February"> February</option>
@ -109,11 +116,11 @@ const inter = Inter({ subsets: ['latin'] })
</div> </div>
<div className='flex flex-col w-full'> <div className='flex flex-col w-full'>
<label htmlFor="start_date" className='text-xl font-bold pt-4'>Start Date</label> <label htmlFor="start_date" className='text-xl font-bold pt-4'>Start Date</label>
<input value={formvalue.start_date} onChange={handleInput} type="date" name="start_date" id="start_date" className=' border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]' /> <input type="date" name="start_date" id="start_date" className=' border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]' />
</div> </div>
<div className='flex flex-col w-full'> <div className='flex flex-col w-full'>
<label htmlFor="end_date" className='text-xl font-bold pt-4'>End Date</label> <label htmlFor="end_date" className='text-xl font-bold pt-4'>End Date</label>
<input value={formvalue.end_date} onChange={handleInput} type="date" name="end_date" id="end_date" className=' border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]' /> <input type="date" name="end_date" id="end_date" className=' border-2 border-[#FE4501] p-2 rounded-md focus:outline-none focus:border-2 focus:border-[#F2B705]' />
</div> </div>
<div className='flex justify-center pt-8'> <div className='flex justify-center pt-8'>
<button className='bg-[#FE4501] hover:shadow-2xl hover:shadow-[#F2B705] p-2.5 rounded-lg px-10 rounded-tl-full rounded-br-full hover:scale-110 active:scale-75 duration-200 text-xl font-bold text-white cursor-pointer'>Submit Now</button> <button className='bg-[#FE4501] hover:shadow-2xl hover:shadow-[#F2B705] p-2.5 rounded-lg px-10 rounded-tl-full rounded-br-full hover:scale-110 active:scale-75 duration-200 text-xl font-bold text-white cursor-pointer'>Submit Now</button>
@ -126,4 +133,3 @@ const inter = Inter({ subsets: ['latin'] })
</main> </main>
) )
} }
export default Postformvalue;

View File

@ -18,6 +18,6 @@
"@/*": ["./src/*"] "@/*": ["./src/*"]
} }
}, },
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "src/pages/add-school-form.jsx", "src/pages/add-school-form.jsx"], "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "src/pages/add-school-form.jsx", "src/pages/add-school-form.jsx", "src/pages/add-user-form.jsx"],
"exclude": ["node_modules"] "exclude": ["node_modules"]
} }