source: my-react-app/src/components/CustomersForm.js@ d24f17c

main
Last change on this file since d24f17c was d24f17c, checked in by Aleksandar Panovski <apano77@…>, 15 months ago

Initial commit

  • Property mode set to 100644
File size: 4.0 KB
RevLine 
[d24f17c]1import React from 'react';
2import MembershipsEnum from "./MembershipsEnum";
3
4const CustomersForm = ({ formData, handleChange, handleSubmit, membershipOptions, isEdit}) => {
5 return (
6 <div>
7 <form onSubmit={handleSubmit} method="post">
8 <div>
9 <label htmlFor="firstName">First Name</label>
10 <div>
11 <input
12 type="text"
13 id="firstName"
14 name="firstName"
15 value={formData.firstName}
16 onChange={handleChange}
17 required
18 />
19 </div>
20 </div>
21 <div>
22 <label htmlFor="lastName">Last Name</label>
23 <div>
24 <input
25 type="text"
26 id="lastName"
27 name="lastName"
28 value={formData.lastName}
29 onChange={handleChange}
30 required
31 />
32 </div>
33 </div>
34 <div>
35 <label htmlFor="email">Email</label>
36 <div>
37 <input
38 type="email"
39 id="email"
40 name="email"
41 value={formData.email}
42 onChange={handleChange}
43 required
44 />
45 </div>
46 </div>
47 <div>
48 <label htmlFor="password">Password</label>
49 <div>
50 <input
51 type="password"
52 id="password"
53 name="password"
54 value={formData.password}
55 onChange={handleChange}
56 required
57 />
58 </div>
59 </div>
60 <div>
61 <label htmlFor="phone">Phone</label>
62 <div>
63 <input
64 type="text"
65 id="phone"
66 name="phone"
67 value={formData.phone}
68 onChange={handleChange}
69 required
70 />
71 </div>
72 </div>
73 <div>
74 <label htmlFor="address">Address</label>
75 <div>
76 <input
77 type="text"
78 id="address"
79 name="address"
80 value={formData.address}
81 onChange={handleChange}
82 required
83 />
84 </div>
85 </div>
86 <div>
87 <label htmlFor="membershipLevel">Membership Type</label>
88 <div>
89 <select
90 id="membershipLevel"
91 name="membershipLevel"
92 value={formData.membershipLevel}
93 onChange={handleChange}
94 required
95 >
96 {MembershipsEnum().map((membership, index) => (
97 <option key={index} value={membership}>
98 {membership}
99 </option>
100 ))}
101 </select>
102 </div>
103 </div>
104 <button type="submit">{isEdit ? 'Update' : 'Register'}</button>
105 </form>
106 </div>
107 );
108};
109
110export default CustomersForm;
Note: See TracBrowser for help on using the repository browser.