Sunny Negi / Meteor-projects

Download as
Browse Code ยป

Commit fdfd4efb976634eddb75037d4cce0413d845bc28

Authored by Deepak
1 parent 7ca753f37e
Exists in master

made student modal bigger

Showing 2 changed files with 71 additions and 81 deletions   Show diff stats
imports/client/views/org/admin/students/add/StudentForm.js
Diff comments   View file @fdfd4ef
1 import React, { PropTypes } from 'react' 1 import React, { PropTypes } from 'react'
2 import { 2 import {
3 Row, 3 Row,
4 Col, 4 Col,
5 FormGroup, 5 FormGroup,
6 FormControl, 6 FormControl,
7 Button 7 Button
8 } from 'react-bootstrap' 8 } from 'react-bootstrap'
9 import DatePicker from '/imports/client/views/core/DatePicker' 9 import DatePicker from '/imports/client/views/core/DatePicker'
10 import Label from '/imports/client/views/core/Label' 10 import Label from '/imports/client/views/core/Label'
11 import Stepper from '/imports/client/views/core/Stepper' 11 import Stepper from '/imports/client/views/core/Stepper'
12 import ErrorLabel from '/imports/client/views/core/ErrorLabel' 12 import ErrorLabel from '/imports/client/views/core/ErrorLabel'
13 13
14 const StudentForm = props => ( 14 const StudentForm = props => (
15 <div className="stepy-validation"> 15 <div className="stepy-validation">
16 <Stepper 16 <Stepper
17 steps={[ 17 steps={[
18 { 18 {
19 label: 'Personal data', 19 label: 'Personal data',
20 active: props.currentStep === 0, 20 active: props.currentStep === 0,
21 }, 21 },
22 { 22 {
23 label: 'Academic', 23 label: 'Academic',
24 active: props.currentStep === 1, 24 active: props.currentStep === 1,
25 }, 25 },
26 { 26 {
27 label: 'Address', 27 label: 'Address',
28 active: props.currentStep === 2, 28 active: props.currentStep === 2,
29 }, 29 },
30 { 30 {
31 label: 'Parent info', 31 label: 'Parent info',
32 active: props.currentStep === 3, 32 active: props.currentStep === 3,
33 } 33 }
34 ]} 34 ]}
35 /> 35 />
36 {props.currentStep === 0 && ( 36 {props.currentStep === 0 && (
37 <fieldset title="1"> 37 <fieldset title="1">
38 <legend className="text-semibold">Personal data</legend> 38 <legend className="text-semibold">Personal data</legend>
39 <Row> 39 <Row>
40 <Col xs={12} sm={6}> 40 <Col xs={12} sm={4}>
41 <FormGroup controlId="admissionId"> 41 <FormGroup controlId="admissionId">
42 <Label required>Admission Id</Label> 42 <Label required>Admission Id</Label>
43 <FormControl 43 <FormControl
44 type="text" 44 type="text"
45 value={props.getValue('admissionId')} 45 value={props.getValue('admissionId')}
46 placeholder="admission Id" 46 placeholder="admission Id"
47 onChange={e => props.setValue('admissionId', e.target.value)} 47 onChange={e => props.setValue('admissionId', e.target.value)}
48 /> 48 />
49 {props.isSubmitted() && props.errors && props.errors.admissionId && ( 49 {props.isSubmitted() && props.errors && props.errors.admissionId && (
50 <ErrorLabel> {props.errors.admissionId} </ErrorLabel> 50 <ErrorLabel> {props.errors.admissionId} </ErrorLabel>
51 )} 51 )}
52 </FormGroup> 52 </FormGroup>
53 </Col> 53 </Col>
54 <Col xs={12} sm={6}> 54 <Col xs={12} sm={4}>
55 <FormGroup controlId="firstName"> 55 <FormGroup controlId="firstName">
56 <Label required>First Name</Label> 56 <Label required>First Name</Label>
57 <FormControl 57 <FormControl
58 type="text" 58 type="text"
59 value={props.getValue('firstName')} 59 value={props.getValue('firstName')}
60 placeholder="First Name" 60 placeholder="First Name"
61 onChange={e => props.setValue('firstName', e.target.value)} 61 onChange={e => props.setValue('firstName', e.target.value)}
62 /> 62 />
63 {props.isSubmitted() && props.errors && props.errors.firstName && ( 63 {props.isSubmitted() && props.errors && props.errors.firstName && (
64 <ErrorLabel> {props.errors.firstName} </ErrorLabel> 64 <ErrorLabel> {props.errors.firstName} </ErrorLabel>
65 )} 65 )}
66 </FormGroup> 66 </FormGroup>
67 </Col> 67 </Col>
68 <Col xs={12} sm={4}>
69 <FormGroup controlId="lastName">
70 <Label required>Last Name</Label>
71 <FormControl
72 type="text"
73 value={props.getValue('lastName')}
74 placeholder="Last Name"
75 onChange={e => props.setValue('lastName', e.target.value)}
76 />
77 {props.isSubmitted() && props.errors && props.errors.lastName && (
78 <ErrorLabel> {props.errors.lastName} </ErrorLabel>
79 )}
80 </FormGroup>
81 </Col>
68 </Row> 82 </Row>
69 <Row> 83 <Row>
70 <Col xs={12} sm={6}> 84 <Col xs={12} sm={4}>
71 <FormGroup controlId="lastName"> 85 <FormGroup controlId="formControlsSelect">
72 <Label required>Last Name</Label> 86 <Label>Gender</Label>
73 <FormControl 87 <FormControl componentClass="select"
74 type="text" 88 placeholder="select"
75 value={props.getValue('lastName')} 89 value={props.getValue('gender')}
76 placeholder="Last Name" 90 onChange={e => props.setValue('gender', e.target.value)}
77 onChange={e => props.setValue('lastName', e.target.value)} 91 >
78 /> 92 <option value="male">Male</option>
79 {props.isSubmitted() && props.errors && props.errors.lastName && ( 93 <option value="female">Female</option>
80 <ErrorLabel> {props.errors.lastName} </ErrorLabel> 94 </FormControl>
81 )} 95 {props.isSubmitted() && props.errors && props.errors.gender && (
82 </FormGroup> 96 <ErrorLabel> {props.errors.gender} </ErrorLabel>
83 </Col> 97 )}
84 <Col xs={12} sm={6}> 98 </FormGroup>
85 <FormGroup controlId="formControlsSelect"> 99 </Col>
86 <Label>Gender</Label> 100 <Col xs={12} sm={4}>
87 <FormControl componentClass="select"
88 placeholder="select"
89 value={props.getValue('gender')}
90 onChange={e => props.setValue('gender', e.target.value)}
91 >
92 <option value="male">Male</option>
93 <option value="female">Female</option>
94 </FormControl>
95 {props.isSubmitted() && props.errors && props.errors.gender && (
96 <ErrorLabel> {props.errors.gender} </ErrorLabel>
97 )}
98 </FormGroup>
99 </Col>
100 </Row>
101 <Row>
102 <Col xs={12} sm={6}>
103 <FormGroup controlId="email"> 101 <FormGroup controlId="email">
104 <Label required>Email</Label> 102 <Label required>Email</Label>
105 <FormControl 103 <FormControl
106 type="email" 104 type="email"
107 value={props.getValue('email')} 105 value={props.getValue('email')}
108 placeholder="Email" 106 placeholder="Email"
109 onChange={e => props.setValue('email', e.target.value)} 107 onChange={e => props.setValue('email', e.target.value)}
110 /> 108 />
111 {props.isSubmitted() && props.errors && props.errors.email && ( 109 {props.isSubmitted() && props.errors && props.errors.email && (
112 <ErrorLabel> {props.errors.email} </ErrorLabel> 110 <ErrorLabel> {props.errors.email} </ErrorLabel>
113 )} 111 )}
114 </FormGroup> 112 </FormGroup>
115 </Col> 113 </Col>
116 <Col xs={12} sm={6}> 114 <Col xs={12} sm={4}>
117 <FormGroup> 115 <FormGroup>
118 <Label required>Date of birth</Label> 116 <Label required>Date of birth</Label>
119 <DatePicker 117 <DatePicker
120 id="dob" 118 id="dob"
121 setValue = {props.setValue} 119 setValue = {props.setValue}
122 value={props.getValue('dob')} 120 value={props.getValue('dob')}
123 onChange={(e) => { 121 onChange={(e) => {
124 props.setValue('dob', e.target.value) 122 props.setValue('dob', e.target.value)
125 }} 123 }}
126 /> 124 />
127 {props.isSubmitted() && props.errors && props.errors.dob && ( 125 {props.isSubmitted() && props.errors && props.errors.dob && (
128 <ErrorLabel> {props.errors.dob} </ErrorLabel> 126 <ErrorLabel> {props.errors.dob} </ErrorLabel>
129 )} 127 )}
130 </FormGroup> 128 </FormGroup>
131 </Col> 129 </Col>
132 </Row> 130 </Row>
133 <Row>
134
135 </Row>
136 </fieldset> 131 </fieldset>
137 )} 132 )}
138 {props.currentStep === 1 && ( 133 {props.currentStep === 1 && (
139 <fieldset title="Academic"> 134 <fieldset title="Academic">
140 <legend className="text-semibold">Academic</legend> 135 <legend className="text-semibold">Academic</legend>
141 <Row> 136 <Row>
142 <Col xs={12} sm={6}> 137 <Col xs={12} sm={4}>
143 <FormGroup controlId="rollNo"> 138 <FormGroup controlId="rollNo">
144 <Label required>Roll No</Label> 139 <Label required>Roll No</Label>
145 <FormControl 140 <FormControl
146 type="text" 141 type="text"
147 value={props.getValue('rollNo')} 142 value={props.getValue('rollNo')}
148 placeholder="Roll No" 143 placeholder="Roll No"
149 onChange={e => props.setValue('rollNo', e.target.value)} 144 onChange={e => props.setValue('rollNo', e.target.value)}
150 /> 145 />
151 {props.isSubmitted() && props.errors && props.errors.rollNo && ( 146 {props.isSubmitted() && props.errors && props.errors.rollNo && (
152 <ErrorLabel> {props.errors.rollNo} </ErrorLabel> 147 <ErrorLabel> {props.errors.rollNo} </ErrorLabel>
153 )} 148 )}
154 </FormGroup> 149 </FormGroup>
155 </Col> 150 </Col>
156 <Col xs={12} sm={6}> 151 <Col xs={12} sm={4}>
157 <FormGroup controlId="class"> 152 <FormGroup controlId="class">
158 <Label required>Class</Label> 153 <Label required>Class</Label>
159 <FormControl 154 <FormControl
160 type="text" 155 type="text"
161 value={props.getValue('studentClass')} 156 value={props.getValue('studentClass')}
162 placeholder="7" 157 placeholder="7"
163 onChange={e => props.setValue('studentClass', e.target.value)} 158 onChange={e => props.setValue('studentClass', e.target.value)}
164 /> 159 />
165 {props.isSubmitted() && props.errors && props.errors.studentClass && ( 160 {props.isSubmitted() && props.errors && props.errors.studentClass && (
166 <ErrorLabel> {props.errors.studentClass} </ErrorLabel> 161 <ErrorLabel> {props.errors.studentClass} </ErrorLabel>
167 )} 162 )}
168 </FormGroup> 163 </FormGroup>
169 </Col> 164 </Col>
170 </Row> 165 <Col xs={12} sm={4}>
171 <Row>
172 <Col xs={12} sm={6}>
173 <FormGroup controlId="section"> 166 <FormGroup controlId="section">
174 <Label required>Section</Label> 167 <Label required>Section</Label>
175 <FormControl 168 <FormControl
176 type="text" 169 type="text"
177 value={props.getValue('section')} 170 value={props.getValue('section')}
178 placeholder="B" 171 placeholder="B"
179 onChange={e => props.setValue('section', e.target.value)} 172 onChange={e => props.setValue('section', e.target.value)}
180 /> 173 />
181 {props.isSubmitted() && props.errors && props.errors.section && ( 174 {props.isSubmitted() && props.errors && props.errors.section && (
182 <ErrorLabel> {props.errors.section} </ErrorLabel> 175 <ErrorLabel> {props.errors.section} </ErrorLabel>
183 )} 176 )}
184 </FormGroup> 177 </FormGroup>
185 </Col> 178 </Col>
186 <Col xs={12} sm={6}> 179 </Row>
180 <Row>
181 <Col xs={12} sm={4}>
187 <FormGroup controlId="community"> 182 <FormGroup controlId="community">
188 <Label required>Community</Label> 183 <Label required>Community</Label>
189 <FormControl 184 <FormControl
190 type="text" 185 type="text"
191 value={props.getValue('community')} 186 value={props.getValue('community')}
192 placeholder="General" 187 placeholder="General"
193 onChange={e => props.setValue('community', e.target.value)} 188 onChange={e => props.setValue('community', e.target.value)}
194 /> 189 />
195 {props.isSubmitted() && props.errors && props.errors.community && ( 190 {props.isSubmitted() && props.errors && props.errors.community && (
196 <ErrorLabel> {props.errors.community} </ErrorLabel> 191 <ErrorLabel> {props.errors.community} </ErrorLabel>
197 )} 192 )}
198 </FormGroup> 193 </FormGroup>
199 </Col> 194 </Col>
200 </Row> 195 <Col xs={12} sm={4}>
201 <Row>
202 <Col xs={12} sm={6}>
203 <FormGroup controlId="bloodGroup"> 196 <FormGroup controlId="bloodGroup">
204 <Label required>bloodGroup</Label> 197 <Label required>bloodGroup</Label>
205 <FormControl 198 <FormControl
206 type="text" 199 type="text"
207 value={props.getValue('bloodGroup')} 200 value={props.getValue('bloodGroup')}
208 placeholder="B+" 201 placeholder="B+"
209 onChange={e => props.setValue('bloodGroup', e.target.value)} 202 onChange={e => props.setValue('bloodGroup', e.target.value)}
210 /> 203 />
211 {props.isSubmitted() && props.errors && props.errors.bloodGroup && ( 204 {props.isSubmitted() && props.errors && props.errors.bloodGroup && (
212 <ErrorLabel> {props.errors.bloodGroup} </ErrorLabel> 205 <ErrorLabel> {props.errors.bloodGroup} </ErrorLabel>
213 )} 206 )}
214 </FormGroup> 207 </FormGroup>
215 </Col> 208 </Col>
216 <Col xs={12} sm={6}> 209 <Col xs={12} sm={4}>
217 <FormGroup controlId="phone"> 210 <FormGroup controlId="phone">
218 <Label required>Phone</Label> 211 <Label required>Phone</Label>
219 <FormControl 212 <FormControl
220 type="text" 213 type="text"
221 value={props.getValue('phone')} 214 value={props.getValue('phone')}
222 placeholder="9999999999" 215 placeholder="9999999999"
223 onChange={e => props.setValue('phone', e.target.value)} 216 onChange={e => props.setValue('phone', e.target.value)}
224 /> 217 />
225 {props.isSubmitted() && props.errors && props.errors.phone && ( 218 {props.isSubmitted() && props.errors && props.errors.phone && (
226 <ErrorLabel> {props.errors.phone} </ErrorLabel> 219 <ErrorLabel> {props.errors.phone} </ErrorLabel>
227 )} 220 )}
228 </FormGroup> 221 </FormGroup>
229 </Col> 222 </Col>
230 </Row> 223 </Row>
231 </fieldset> 224 </fieldset>
232 )} 225 )}
233 {props.currentStep === 2 && ( 226 {props.currentStep === 2 && (
234 <fieldset title="Address"> 227 <fieldset title="Address">
235 <legend className="text-semibold">Address</legend> 228 <legend className="text-semibold">Address</legend>
236 <Row> 229 <Row>
237 <Col xs={12} sm={6}> 230 <Col xs={12} sm={4}>
238 <FormGroup controlId="address"> 231 <FormGroup controlId="address">
239 <Label required>Address</Label> 232 <Label required>Address</Label>
240 <FormControl 233 <FormControl
241 type="text" 234 type="text"
242 value={props.getValue('address')} 235 value={props.getValue('address')}
243 placeholder="#876, Street, town" 236 placeholder="#876, Street, town"
244 onChange={e => props.setValue('address', e.target.value)} 237 onChange={e => props.setValue('address', e.target.value)}
245 /> 238 />
246 {props.isSubmitted() && props.errors && props.errors.address && ( 239 {props.isSubmitted() && props.errors && props.errors.address && (
247 <ErrorLabel> {props.errors.address} </ErrorLabel> 240 <ErrorLabel> {props.errors.address} </ErrorLabel>
248 )} 241 )}
249 </FormGroup> 242 </FormGroup>
250 </Col> 243 </Col>
251 <Col xs={12} sm={6}> 244 <Col xs={12} sm={4}>
252 <FormGroup controlId="city"> 245 <FormGroup controlId="city">
253 <Label required>City</Label> 246 <Label required>City</Label>
254 <FormControl 247 <FormControl
255 type="text" 248 type="text"
256 value={props.getValue('city')} 249 value={props.getValue('city')}
257 placeholder="Chennai" 250 placeholder="Chennai"
258 onChange={e => props.setValue('city', e.target.value)} 251 onChange={e => props.setValue('city', e.target.value)}
259 /> 252 />
260 {props.isSubmitted() && props.errors && props.errors.city && ( 253 {props.isSubmitted() && props.errors && props.errors.city && (
261 <ErrorLabel> {props.errors.city} </ErrorLabel> 254 <ErrorLabel> {props.errors.city} </ErrorLabel>
262 )} 255 )}
263 </FormGroup> 256 </FormGroup>
264 </Col> 257 </Col>
265 </Row> 258 <Col xs={12} sm={4}>
266 <Row>
267 <Col xs={12} sm={6}>
268 <FormGroup controlId="state"> 259 <FormGroup controlId="state">
269 <Label required>State</Label> 260 <Label required>State</Label>
270 <FormControl 261 <FormControl
271 type="text" 262 type="text"
272 value={props.getValue('state')} 263 value={props.getValue('state')}
273 placeholder="Tamilnadu" 264 placeholder="Tamilnadu"
274 onChange={e => props.setValue('state', e.target.value)} 265 onChange={e => props.setValue('state', e.target.value)}
275 /> 266 />
276 {props.isSubmitted() && props.errors && props.errors.state && ( 267 {props.isSubmitted() && props.errors && props.errors.state && (
277 <ErrorLabel> {props.errors.state} </ErrorLabel> 268 <ErrorLabel> {props.errors.state} </ErrorLabel>
278 )} 269 )}
279 </FormGroup> 270 </FormGroup>
280 </Col> 271 </Col>
281 </Row> 272 </Row>
282 </fieldset> 273 </fieldset>
283 )} 274 )}
284 {props.currentStep === 3 && ( 275 {props.currentStep === 3 && (
285 <fieldset title="2"> 276 <fieldset title="2">
286 <legend className="text-semibold">Parent information</legend> 277 <legend className="text-semibold">Parent information</legend>
287 <Row> 278 <Row>
288 <Col xs={12} sm={6}> 279 <Col xs={12} sm={4}>
289 <FormGroup controlId="parentName"> 280 <FormGroup controlId="parentName">
290 <Label required>Parent Name</Label> 281 <Label required>Parent Name</Label>
291 <FormControl 282 <FormControl
292 type="text" 283 type="text"
293 value={props.getValue('parentName')} 284 value={props.getValue('parentName')}
294 placeholder="John" 285 placeholder="John"
295 onChange={e => props.setValue('parentName', e.target.value)} 286 onChange={e => props.setValue('parentName', e.target.value)}
296 /> 287 />
297 {props.isSubmitted() && props.errors && props.errors.parentName && ( 288 {props.isSubmitted() && props.errors && props.errors.parentName && (
298 <ErrorLabel> {props.errors.parentName} </ErrorLabel> 289 <ErrorLabel> {props.errors.parentName} </ErrorLabel>
299 )} 290 )}
300 </FormGroup> 291 </FormGroup>
301 </Col> 292 </Col>
302 <Col xs={12} sm={6}> 293 <Col xs={12} sm={4}>
303 <FormGroup controlId="parentEmail"> 294 <FormGroup controlId="parentEmail">
304 <Label required>Parent Email</Label> 295 <Label required>Parent Email</Label>
305 <FormControl 296 <FormControl
306 type="text" 297 type="text"
307 value={props.getValue('parentEmail')} 298 value={props.getValue('parentEmail')}
308 placeholder="john@email.com" 299 placeholder="john@email.com"
309 onChange={e => props.setValue('parentEmail', e.target.value)} 300 onChange={e => props.setValue('parentEmail', e.target.value)}
310 /> 301 />
311 {props.isSubmitted() && props.errors && props.errors.parentEmail && ( 302 {props.isSubmitted() && props.errors && props.errors.parentEmail && (
312 <ErrorLabel> {props.errors.parentEmail} </ErrorLabel> 303 <ErrorLabel> {props.errors.parentEmail} </ErrorLabel>
313 )} 304 )}
314 </FormGroup> 305 </FormGroup>
315 </Col> 306 </Col>
316 </Row> 307 <Col xs={12} sm={4}>
317 <Row>
318 <Col xs={12} sm={6}>
319 <FormGroup controlId="relation"> 308 <FormGroup controlId="relation">
320 <Label required>Relation</Label> 309 <Label required>Relation</Label>
321 <FormControl 310 <FormControl
322 type="text" 311 type="text"
323 value={props.getValue('relation')} 312 value={props.getValue('relation')}
324 placeholder="Father" 313 placeholder="Father"
325 onChange={e => props.setValue('relation', e.target.value)} 314 onChange={e => props.setValue('relation', e.target.value)}
326 /> 315 />
327 {props.isSubmitted() && props.errors && props.errors.relation && ( 316 {props.isSubmitted() && props.errors && props.errors.relation && (
328 <ErrorLabel> {props.errors.relation} </ErrorLabel> 317 <ErrorLabel> {props.errors.relation} </ErrorLabel>
329 )} 318 )}
330 </FormGroup> 319 </FormGroup>
331 </Col> 320 </Col>
332 <Col xs={12} sm={6}> 321 </Row>
322 <Row>
323 <Col xs={12} sm={4}>
333 <FormGroup controlId="profession"> 324 <FormGroup controlId="profession">
334 <Label required>Profession</Label> 325 <Label required>Profession</Label>
335 <FormControl 326 <FormControl
336 type="text" 327 type="text"
337 value={props.getValue('profession')} 328 value={props.getValue('profession')}
338 placeholder="Farmer" 329 placeholder="Farmer"
339 onChange={e => props.setValue('profession', e.target.value)} 330 onChange={e => props.setValue('profession', e.target.value)}
340 /> 331 />
341 {props.isSubmitted() && props.errors && props.errors.profession && ( 332 {props.isSubmitted() && props.errors && props.errors.profession && (
342 <ErrorLabel> {props.errors.profession} </ErrorLabel> 333 <ErrorLabel> {props.errors.profession} </ErrorLabel>
343 )} 334 )}
344 </FormGroup> 335 </FormGroup>
345 </Col> 336 </Col>
346 </Row> 337 <Col xs={12} sm={4}>
347 <Row>
348 <Col xs={12} sm={6}>
349 <FormGroup controlId="parentGender"> 338 <FormGroup controlId="parentGender">
350 <Label>Parent Gender</Label> 339 <Label>Parent Gender</Label>
351 <FormControl componentClass="select" 340 <FormControl componentClass="select"
352 placeholder="select" 341 placeholder="select"
353 value={props.getValue('parentGender')} 342 value={props.getValue('parentGender')}
354 onChange={e => props.setValue('parentGender', e.target.value)} 343 onChange={e => props.setValue('parentGender', e.target.value)}
355 > 344 >
356 <option value="male">Male</option> 345 <option value="male">Male</option>
357 <option value="female">Female</option> 346 <option value="female">Female</option>
358 </FormControl> 347 </FormControl>
359 {props.isSubmitted() && props.errors && props.errors.parentGender && ( 348 {props.isSubmitted() && props.errors && props.errors.parentGender && (
360 <ErrorLabel> {props.errors.parentGender} </ErrorLabel> 349 <ErrorLabel> {props.errors.parentGender} </ErrorLabel>
361 )} 350 )}
362 </FormGroup> 351 </FormGroup>
363 </Col> 352 </Col>
364 <Col xs={12} sm={6}> 353 <Col xs={12} sm={4}>
365 <FormGroup controlId="parentPhone"> 354 <FormGroup controlId="parentPhone">
366 <Label required>Parent Phone</Label> 355 <Label required>Parent Phone</Label>
367 <FormControl 356 <FormControl
368 type="text" 357 type="text"
369 value={props.getValue('parentPhone')} 358 value={props.getValue('parentPhone')}
370 placeholder="9876543210" 359 placeholder="9876543210"
371 onChange={e => props.setValue('parentPhone', e.target.value)} 360 onChange={e => props.setValue('parentPhone', e.target.value)}
372 /> 361 />
373 {props.isSubmitted() && props.errors && props.errors.parentPhone && ( 362 {props.isSubmitted() && props.errors && props.errors.parentPhone && (
374 <ErrorLabel> {props.errors.parentPhone} </ErrorLabel> 363 <ErrorLabel> {props.errors.parentPhone} </ErrorLabel>
375 )} 364 )}
376 </FormGroup> 365 </FormGroup>
377 </Col> 366 </Col>
378 </Row> 367 </Row>
379 <Row> 368 <Row>
380 <Col xs={12} sm={6}> 369 <Col xs={12} sm={4}>
381 <FormGroup controlId="parentAddress"> 370 <FormGroup controlId="parentAddress">
382 <Label required>Parent Address</Label> 371 <Label required>Parent Address</Label>
383 <FormControl 372 <FormControl
384 type="text" 373 type="text"
385 value={props.getValue('parentAddress')} 374 value={props.getValue('parentAddress')}
386 placeholder="#12, street, town" 375 placeholder="#12, street, town"
387 onChange={e => props.setValue('parentAddress', e.target.value)} 376 onChange={e => props.setValue('parentAddress', e.target.value)}
388 /> 377 />
389 {props.isSubmitted() && props.errors && props.errors.parentAddress && ( 378 {props.isSubmitted() && props.errors && props.errors.parentAddress && (
390 <ErrorLabel> {props.errors.parentAddress} </ErrorLabel> 379 <ErrorLabel> {props.errors.parentAddress} </ErrorLabel>
391 )} 380 )}
392 </FormGroup> 381 </FormGroup>
393 </Col> 382 </Col>
394 <Col xs={12} sm={6}> 383 <Col xs={12} sm={4}>
395 <FormGroup controlId="parentCity"> 384 <FormGroup controlId="parentCity">
396 <Label required>Parent City</Label> 385 <Label required>Parent City</Label>
397 <FormControl 386 <FormControl
398 type="text" 387 type="text"
399 value={props.getValue('parentCity')} 388 value={props.getValue('parentCity')}
400 placeholder="Chennai" 389 placeholder="Chennai"
401 onChange={e => props.setValue('parentCity', e.target.value)} 390 onChange={e => props.setValue('parentCity', e.target.value)}
402 /> 391 />
403 {props.isSubmitted() && props.errors && props.errors.parentCity && ( 392 {props.isSubmitted() && props.errors && props.errors.parentCity && (
404 <ErrorLabel> {props.errors.parentCity} </ErrorLabel> 393 <ErrorLabel> {props.errors.parentCity} </ErrorLabel>
405 )} 394 )}
406 </FormGroup> 395 </FormGroup>
407 </Col> 396 </Col>
397 <Col xs={12} sm={4}>
398 <FormGroup controlId="parentState">
399 <Label required>Parent State</Label>
400 <FormControl
401 type="text"
402 value={props.getValue('parentState')}
403 placeholder="600031"
404 onChange={e => props.setValue('parentState', e.target.value)}
405 />
406 {props.isSubmitted() && props.errors && props.errors.parentState && (
407 <ErrorLabel> {props.errors.parentState} </ErrorLabel>
408 )}
409 </FormGroup>
410 </Col>
408 </Row> 411 </Row>
409 <Row> 412 <Row>
410 <Col xs={12} sm={6}> 413 <Col xs={12} sm={4}>
411 <FormGroup controlId="parentState">
412 <Label required>Parent State</Label>
413 <FormControl
414 type="text"
415 value={props.getValue('parentState')}
416 placeholder="600031"
417 onChange={e => props.setValue('parentState', e.target.value)}
418 />
419 {props.isSubmitted() && props.errors && props.errors.parentState && (
420 <ErrorLabel> {props.errors.parentState} </ErrorLabel>
421 )}
422 </FormGroup>
423 </Col>
424 <Col xs={12} sm={6}>
425 <FormGroup controlId="parentZipcode"> 414 <FormGroup controlId="parentZipcode">
426 <Label required>Parent Zipcode</Label> 415 <Label required>Parent Zipcode</Label>
427 <FormControl 416 <FormControl
428 type="text" 417 type="text"
429 value={props.getValue('parentZipcode')} 418 value={props.getValue('parentZipcode')}
430 placeholder="600031" 419 placeholder="600031"
431 onChange={e => props.setValue('parentZipcode', e.target.value)} 420 onChange={e => props.setValue('parentZipcode', e.target.value)}
432 /> 421 />
433 {props.isSubmitted() && props.errors && props.errors.parentZipcode && ( 422 {props.isSubmitted() && props.errors && props.errors.parentZipcode && (
434 <ErrorLabel> {props.errors.parentZipcode} </ErrorLabel> 423 <ErrorLabel> {props.errors.parentZipcode} </ErrorLabel>
435 )} 424 )}
436 </FormGroup> 425 </FormGroup>
437 </Col> 426 </Col>
438 </Row> 427 </Row>
439 </fieldset> 428 </fieldset>
440 )} 429 )}
441 <div style={{ textAlign: 'left' }}> 430 <div style={{ textAlign: 'left' }}>
442 {props.currentStep > 0 && ( 431 {props.currentStep > 0 && (
443 <div style={{ display: 'inline-block', marginRight: 10 }}> 432 <div style={{ display: 'inline-block', marginRight: 10 }}>
444 <Button onClick={props.onBackClick}> 433 <Button onClick={props.onBackClick}>
445 <i className="icon-arrow-left13 position-left"></i> 434 <i className="icon-arrow-left13 position-left"></i>
446 BACK 435 BACK
447 </Button> 436 </Button>
448 437
449 </div> 438 </div>
450 )} 439 )}
451 {props.currentStep < 3 && ( 440 {props.currentStep < 3 && (
452 <div style={{ display: 'inline-block' }}> 441 <div style={{ display: 'inline-block' }}>
453 <Button 442 <Button
454 bsStyle="primary" 443 bsStyle="primary"
imports/client/views/org/admin/students/add/addStudent.js
Diff comments   View file @fdfd4ef
1 import _ from 'lodash'; 1 import _ from 'lodash';
2 import { Meteor } from 'meteor/meteor'; 2 import { Meteor } from 'meteor/meteor';
3 import React, { Component } from 'react'; 3 import React, { Component } from 'react';
4 import { Link,browserHistory } from 'react-router'; 4 import { Link,browserHistory } from 'react-router';
5 import { FormGroup,Panel,Table, 5 import { FormGroup,Panel,Table,
6 ButtonToolbar,Modal, 6 ButtonToolbar,Modal,
7 FormControl,Glyphicon,Button } from 'react-bootstrap'; 7 FormControl,Glyphicon,Button } from 'react-bootstrap';
8 import { AddStudentFormContainer } from './AddStudentFormContainer'; 8 import { AddStudentFormContainer } from './AddStudentFormContainer';
9 9
10 const style = { 10 const style = {
11 margin: 12, 11 margin: 12,
12 }; 12 };
13 export class AddStudent extends Component { 13 export class AddStudent extends Component {
14 constructor(props) { 14 constructor(props) {
15 super(props); 15 super(props);
16 this.state = { 16 this.state = {
17 show: false 17 show: false
18 }; 18 };
19 this.showModal = this.showModal.bind(this); 19 this.showModal = this.showModal.bind(this);
20 this.hideModal = this.hideModal.bind(this); 20 this.hideModal = this.hideModal.bind(this);
21 this.onUpdate = this.onUpdate.bind(this); 21 this.onUpdate = this.onUpdate.bind(this);
22 }; 22 };
23 23
24 showModal() { 24 showModal() {
25 this.setState({show: true}); 25 this.setState({show: true});
26 } 26 }
27 27
28 hideModal() { 28 hideModal() {
29 this.setState({show: false}); 29 this.setState({show: false});
30 } 30 }
31 onUpdate(key, value) { 31 onUpdate(key, value) {
32 this.setState({[key]: value}); 32 this.setState({[key]: value});
33 }; 33 };
34 34
35 render() { 35 render() {
36 return ( 36 return (
37 <ButtonToolbar> 37 <ButtonToolbar>
38 <Button bsStyle="primary" onClick={this.showModal}> 38 <Button bsStyle="primary" onClick={this.showModal}>
39 Add Student 39 Add Student
40 </Button> 40 </Button>
41 <Modal 41 <Modal
42 {...this.props} 42 {...this.props}
43 show={this.state.show} 43 show={this.state.show}
44 onHide={this.hideModal} 44 onHide={this.hideModal}
45 dialogClassName="custom-modal" 45 dialogClassName="custom-modal"
46 bsSize="large"
46 > 47 >
47 <Modal.Header closeButton> 48 <Modal.Header closeButton>
48 <Modal.Title id="contained-modal-title-lg">Add Student</Modal.Title> 49 <Modal.Title id="contained-modal-title-lg">Add Student</Modal.Title>
49 </Modal.Header> 50 </Modal.Header>
50 <Modal.Body> 51 <Modal.Body>
51 <AddStudentFormContainer /> 52 <AddStudentFormContainer />
52 </Modal.Body> 53 </Modal.Body>
53 {/* 54 {/*
54 <Modal.Footer> 55 <Modal.Footer>
55 <Button onClick={this.hideModal}>Close</Button> 56 <Button onClick={this.hideModal}>Close</Button>
56 </Modal.Footer> 57 </Modal.Footer>
57 */} 58 */}
58 </Modal> 59 </Modal>
59 </ButtonToolbar> 60 </ButtonToolbar>
60 ); 61 );
61 }; 62 };
62 63
63 }; 64 };
64 65