Skip to content

Commit 6fb05be

Browse files
author
pipeline
committed
bug(EJ2-5149): commit for fixing label issue for master
1 parent 8f46fa0 commit 6fb05be

File tree

4 files changed

+58
-58
lines changed

4 files changed

+58
-58
lines changed

‎production/react/demos/samples/form-validator/default/app/index.tsx

21 Bytes
Binary file not shown.

‎production/react/demos/src/form-validator/default.tsx

19 Bytes
Binary file not shown.

‎samples/form-validator/default/app/index.tsx

Lines changed: 29 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -16,19 +16,19 @@ export class Default extends SampleBase<{}, {}>{
1616
rules: {
1717
Required: { required: true },
1818
Email: { required: true, email: true },
19-
Url: { url: true },
20-
Date: { date: true },
21-
DateISO: { dateIso: true },
22-
Number: { number: true },
23-
Digits: { digits: true },
24-
MaxLength: { maxLength: 5 },
25-
MinLength: { minLength: 5 },
26-
RangeLength: { rangeLength: [5, 10] },
27-
Range: { range: [5, 10] },
28-
Max: { max: 5 },
29-
Min: { min: 5 },
30-
Regex: { regex: ['^[A-z]+$', 'Allowed only alphabets'] },
31-
Custom: { custom: [customFunction, 'Allowed char length is 5'] }
19+
Url: { required: true, url: true },
20+
Date: { required: true, date: true },
21+
DateISO: { required: true, dateIso: true },
22+
Number: { required: true, number: true },
23+
Digits: { required: true, digits: true },
24+
MaxLength: { required: true, maxLength: 5 },
25+
MinLength: { required: true, minLength: 5 },
26+
RangeLength: { required: true, rangeLength: [5, 10] },
27+
Range: { required: true, range: [5, 10] },
28+
Max: { required: true, max: 5 },
29+
Min: { required: true, min: 5 },
30+
Regex: { required: true, regex: ['^[A-z]+$', 'Allowed only alphabets'] },
31+
Custom: { required: true, custom: [customFunction, 'Allowed char length is 5'] }
3232
},
3333
// Initialize the custom placement
3434
customPlacement: (inputElement: HTMLElement, errorElement: HTMLElement) => {
@@ -44,124 +44,124 @@ export class Default extends SampleBase<{}, {}>{
4444
render() {
4545
return (
4646
<div className='control-pane'>
47-
<div className='control-section'>
47+
<div className='col-lg-12 control-section'>
4848
<div className='content-wrapper' style={{ marginBottom: '25px' }}>
4949
<form id='htmlFormId' className='htmlForm-horizontal'>
5050
<div className='form-group'>
5151
<div className='e-float-input'>
52-
<input type='text' id='required' name='Required' data-msg-containerid='requiredError' />
52+
<input type='text' id='required' name='Required' required data-msg-containerid='requiredError' />
5353
<span className='e-float-line'></span>
5454
<label className='e-float-text' htmlFor='required'>Required</label>
5555
</div>
5656
<div id='requiredError'></div>
5757
</div>
5858
<div className='form-group'>
5959
<div className='e-float-input'>
60-
<input type='text' id='email' name='Email' data-msg-containerid='emailError' />
60+
<input type='text' id='email' name='Email' required data-msg-containerid='emailError' />
6161
<span className='e-float-line'></span>
6262
<label className='e-float-text' htmlFor='email'>Email</label>
6363
</div>
6464
<div id='emailError'></div>
6565
</div>
6666
<div className='form-group'>
6767
<div className='e-float-input'>
68-
<input type='text' id='url' name='Url' data-msg-containerid='urlError' />
68+
<input type='text' id='url' name='Url' required data-msg-containerid='urlError' />
6969
<span className='e-float-line'></span>
7070
<label className='e-float-text' htmlFor='url'>URL</label>
7171
</div>
7272
<div id='urlError'></div>
7373
</div>
7474
<div className='form-group'>
7575
<div className='e-float-input'>
76-
<input type='text' id='date' name='Date' data-msg-containerid='dateError' />
76+
<input type='text' id='date' name='Date' required data-msg-containerid='dateError' />
7777
<span className='e-float-line'></span>
7878
<label className='e-float-text' htmlFor='date'>Date</label>
7979
</div>
8080
<div id='dateError'></div>
8181
</div>
8282
<div className='form-group'>
8383
<div className='e-float-input'>
84-
<input type='text' id='dateIso' name='DateISO' data-msg-containerid='dateisoError' />
84+
<input type='text' id='dateIso' name='DateISO' required data-msg-containerid='dateisoError' />
8585
<span className='e-float-line'></span>
8686
<label className='e-float-text' htmlFor='dateIso'>Date ISO (YYYY-MM-DD)</label>
8787
</div>
8888
<div id='dateisoError'></div>
8989
</div>
9090
<div className='form-group'>
9191
<div className='e-float-input'>
92-
<input type='text' id='number' name='Number' data-msg-containerid='numberError' />
92+
<input type='text' id='number' name='Number' required data-msg-containerid='numberError' />
9393
<span className='e-float-line'></span>
9494
<label className='e-float-text' htmlFor='number'>Integer or Decimal</label>
9595
</div>
9696
<div id='numberError'></div>
9797
</div>
9898
<div className='form-group'>
9999
<div className='e-float-input'>
100-
<input type='text' id='digits' name='Digits' data-msg-containerid='digitError' />
100+
<input type='text' id='digits' name='Digits' required data-msg-containerid='digitError' />
101101
<span className='e-float-line'></span>
102102
<label className='e-float-text' htmlFor='digits'>Positive Integer</label>
103103
</div>
104104
<div id='digitError'></div>
105105
</div>
106106
<div className='form-group'>
107107
<div className='e-float-input'>
108-
<input type='text' id='maxlen' name='MaxLength' data-msg-containerid='maxlenError' />
108+
<input type='text' id='maxlen' name='MaxLength' required data-msg-containerid='maxlenError' />
109109
<span className='e-float-line'></span>
110110
<label className='e-float-text' htmlFor='maxlen'>Maximum 5 characters</label>
111111
</div>
112112
<div id='maxlenError'></div>
113113
</div>
114114
<div className='form-group'>
115115
<div className='e-float-input'>
116-
<input type='text' id='minlen' name='MinLength' data-msg-containerid='minlenError' />
116+
<input type='text' id='minlen' name='MinLength' required data-msg-containerid='minlenError' />
117117
<span className='e-float-line'></span>
118118
<label className='e-float-text' htmlFor='minlen'>Minimum 5 characters</label>
119119
</div>
120120
<div id='minlenError'></div>
121121
</div>
122122
<div className='form-group'>
123123
<div className='e-float-input'>
124-
<input type='text' id='rangelen' name='RangeLength' data-msg-containerid='rangelenError' />
124+
<input type='text' id='rangelen' name='RangeLength' required data-msg-containerid='rangelenError' />
125125
<span className='e-float-line'></span>
126126
<label className='e-float-text' htmlFor='rangelen'>Characters length between 5 to 10</label>
127127
</div>
128128
<div id='rangelenError'></div>
129129
</div>
130130
<div className='form-group'>
131131
<div className='e-float-input'>
132-
<input type='text' id='range' name='Range' data-msg-containerid='rangeError' />
132+
<input type='text' id='range' name='Range' required data-msg-containerid='rangeError' />
133133
<span className='e-float-line'></span>
134134
<label className='e-float-text' htmlFor='range'>Value between 5 to 10</label>
135135
</div>
136136
<div id='rangeError'></div>
137137
</div>
138138
<div className='form-group'>
139139
<div className='e-float-input'>
140-
<input type='text' id='max' name='Max' data-msg-containerid='maxError' />
140+
<input type='text' id='max' name='Max' required data-msg-containerid='maxError' />
141141
<span className='e-float-line'></span>
142142
<label className='e-float-text' htmlFor='max'>Max (maximum value 5)</label>
143143
</div>
144144
<div id='maxError'></div>
145145
</div>
146146
<div className='form-group'>
147147
<div className='e-float-input'>
148-
<input type='text' id='min' name='Min' data-msg-containerid='minError' />
148+
<input type='text' id='min' name='Min' required data-msg-containerid='minError' />
149149
<span className='e-float-line'></span>
150150
<label className='e-float-text' htmlFor='min'>Min (minimum value 5)</label>
151151
</div>
152152
<div id='minError'></div>
153153
</div>
154154
<div className='form-group'>
155155
<div className='e-float-input'>
156-
<input type='text' id='regex' name='Regex' data-msg-containerid='regexError' />
156+
<input type='text' id='regex' name='Regex' required data-msg-containerid='regexError' />
157157
<span className='e-float-line'></span>
158158
<label className='e-float-text' htmlFor='regex'>Regex (accepts alphabets only)</label>
159159
</div>
160160
<div id="regexError"></div>
161161
</div>
162162
<div className='form-group'>
163163
<div className='e-float-input'>
164-
<input type='text' id='custom' name='Custom' data-msg-containerid='customError' />
164+
<input type='text' id='custom' name='Custom' required data-msg-containerid='customError' />
165165
<span className='e-float-line'></span>
166166
<label className='e-float-text' htmlFor='custom'>Custom Function (maximum 5 characters)</label>
167167
</div>

‎src/form-validator/default.tsx

Lines changed: 29 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -16,19 +16,19 @@ export class Default extends SampleBase<{}, {}>{
1616
rules: {
1717
Required: { required: true },
1818
Email: { required: true, email: true },
19-
Url: { url: true },
20-
Date: { date: true },
21-
DateISO: { dateIso: true },
22-
Number: { number: true },
23-
Digits: { digits: true },
24-
MaxLength: { maxLength: 5 },
25-
MinLength: { minLength: 5 },
26-
RangeLength: { rangeLength: [5, 10] },
27-
Range: { range: [5, 10] },
28-
Max: { max: 5 },
29-
Min: { min: 5 },
30-
Regex: { regex: ['^[A-z]+$', 'Allowed only alphabets'] },
31-
Custom: { custom: [customFunction, 'Allowed char length is 5'] }
19+
Url: { required: true, url: true },
20+
Date: { required: true, date: true },
21+
DateISO: { required: true, dateIso: true },
22+
Number: { required: true, number: true },
23+
Digits: { required: true, digits: true },
24+
MaxLength: { required: true, maxLength: 5 },
25+
MinLength: { required: true, minLength: 5 },
26+
RangeLength: { required: true, rangeLength: [5, 10] },
27+
Range: { required: true, range: [5, 10] },
28+
Max: { required: true, max: 5 },
29+
Min: { required: true, min: 5 },
30+
Regex: { required: true, regex: ['^[A-z]+$', 'Allowed only alphabets'] },
31+
Custom: { required: true, custom: [customFunction, 'Allowed char length is 5'] }
3232
},
3333
// Initialize the custom placement
3434
customPlacement: (inputElement: HTMLElement, errorElement: HTMLElement) => {
@@ -44,124 +44,124 @@ export class Default extends SampleBase<{}, {}>{
4444
render() {
4545
return (
4646
<div className='control-pane'>
47-
<div className='control-section'>
47+
<div className='col-lg-12 control-section'>
4848
<div className='content-wrapper' style={{ marginBottom: '25px' }}>
4949
<form id='htmlFormId' className='htmlForm-horizontal'>
5050
<div className='form-group'>
5151
<div className='e-float-input'>
52-
<input type='text' id='required' name='Required' data-msg-containerid='requiredError' />
52+
<input type='text' id='required' name='Required' required data-msg-containerid='requiredError' />
5353
<span className='e-float-line'></span>
5454
<label className='e-float-text' htmlFor='required'>Required</label>
5555
</div>
5656
<div id='requiredError'></div>
5757
</div>
5858
<div className='form-group'>
5959
<div className='e-float-input'>
60-
<input type='text' id='email' name='Email' data-msg-containerid='emailError' />
60+
<input type='text' id='email' name='Email' required data-msg-containerid='emailError' />
6161
<span className='e-float-line'></span>
6262
<label className='e-float-text' htmlFor='email'>Email</label>
6363
</div>
6464
<div id='emailError'></div>
6565
</div>
6666
<div className='form-group'>
6767
<div className='e-float-input'>
68-
<input type='text' id='url' name='Url' data-msg-containerid='urlError' />
68+
<input type='text' id='url' name='Url' required data-msg-containerid='urlError' />
6969
<span className='e-float-line'></span>
7070
<label className='e-float-text' htmlFor='url'>URL</label>
7171
</div>
7272
<div id='urlError'></div>
7373
</div>
7474
<div className='form-group'>
7575
<div className='e-float-input'>
76-
<input type='text' id='date' name='Date' data-msg-containerid='dateError' />
76+
<input type='text' id='date' name='Date' required data-msg-containerid='dateError' />
7777
<span className='e-float-line'></span>
7878
<label className='e-float-text' htmlFor='date'>Date</label>
7979
</div>
8080
<div id='dateError'></div>
8181
</div>
8282
<div className='form-group'>
8383
<div className='e-float-input'>
84-
<input type='text' id='dateIso' name='DateISO' data-msg-containerid='dateisoError' />
84+
<input type='text' id='dateIso' name='DateISO' required data-msg-containerid='dateisoError' />
8585
<span className='e-float-line'></span>
8686
<label className='e-float-text' htmlFor='dateIso'>Date ISO (YYYY-MM-DD)</label>
8787
</div>
8888
<div id='dateisoError'></div>
8989
</div>
9090
<div className='form-group'>
9191
<div className='e-float-input'>
92-
<input type='text' id='number' name='Number' data-msg-containerid='numberError' />
92+
<input type='text' id='number' name='Number' required data-msg-containerid='numberError' />
9393
<span className='e-float-line'></span>
9494
<label className='e-float-text' htmlFor='number'>Integer or Decimal</label>
9595
</div>
9696
<div id='numberError'></div>
9797
</div>
9898
<div className='form-group'>
9999
<div className='e-float-input'>
100-
<input type='text' id='digits' name='Digits' data-msg-containerid='digitError' />
100+
<input type='text' id='digits' name='Digits' required data-msg-containerid='digitError' />
101101
<span className='e-float-line'></span>
102102
<label className='e-float-text' htmlFor='digits'>Positive Integer</label>
103103
</div>
104104
<div id='digitError'></div>
105105
</div>
106106
<div className='form-group'>
107107
<div className='e-float-input'>
108-
<input type='text' id='maxlen' name='MaxLength' data-msg-containerid='maxlenError' />
108+
<input type='text' id='maxlen' name='MaxLength' required data-msg-containerid='maxlenError' />
109109
<span className='e-float-line'></span>
110110
<label className='e-float-text' htmlFor='maxlen'>Maximum 5 characters</label>
111111
</div>
112112
<div id='maxlenError'></div>
113113
</div>
114114
<div className='form-group'>
115115
<div className='e-float-input'>
116-
<input type='text' id='minlen' name='MinLength' data-msg-containerid='minlenError' />
116+
<input type='text' id='minlen' name='MinLength' required data-msg-containerid='minlenError' />
117117
<span className='e-float-line'></span>
118118
<label className='e-float-text' htmlFor='minlen'>Minimum 5 characters</label>
119119
</div>
120120
<div id='minlenError'></div>
121121
</div>
122122
<div className='form-group'>
123123
<div className='e-float-input'>
124-
<input type='text' id='rangelen' name='RangeLength' data-msg-containerid='rangelenError' />
124+
<input type='text' id='rangelen' name='RangeLength' required data-msg-containerid='rangelenError' />
125125
<span className='e-float-line'></span>
126126
<label className='e-float-text' htmlFor='rangelen'>Characters length between 5 to 10</label>
127127
</div>
128128
<div id='rangelenError'></div>
129129
</div>
130130
<div className='form-group'>
131131
<div className='e-float-input'>
132-
<input type='text' id='range' name='Range' data-msg-containerid='rangeError' />
132+
<input type='text' id='range' name='Range' required data-msg-containerid='rangeError' />
133133
<span className='e-float-line'></span>
134134
<label className='e-float-text' htmlFor='range'>Value between 5 to 10</label>
135135
</div>
136136
<div id='rangeError'></div>
137137
</div>
138138
<div className='form-group'>
139139
<div className='e-float-input'>
140-
<input type='text' id='max' name='Max' data-msg-containerid='maxError' />
140+
<input type='text' id='max' name='Max' required data-msg-containerid='maxError' />
141141
<span className='e-float-line'></span>
142142
<label className='e-float-text' htmlFor='max'>Max (maximum value 5)</label>
143143
</div>
144144
<div id='maxError'></div>
145145
</div>
146146
<div className='form-group'>
147147
<div className='e-float-input'>
148-
<input type='text' id='min' name='Min' data-msg-containerid='minError' />
148+
<input type='text' id='min' name='Min' required data-msg-containerid='minError' />
149149
<span className='e-float-line'></span>
150150
<label className='e-float-text' htmlFor='min'>Min (minimum value 5)</label>
151151
</div>
152152
<div id='minError'></div>
153153
</div>
154154
<div className='form-group'>
155155
<div className='e-float-input'>
156-
<input type='text' id='regex' name='Regex' data-msg-containerid='regexError' />
156+
<input type='text' id='regex' name='Regex' required data-msg-containerid='regexError' />
157157
<span className='e-float-line'></span>
158158
<label className='e-float-text' htmlFor='regex'>Regex (accepts alphabets only)</label>
159159
</div>
160160
<div id="regexError"></div>
161161
</div>
162162
<div className='form-group'>
163163
<div className='e-float-input'>
164-
<input type='text' id='custom' name='Custom' data-msg-containerid='customError' />
164+
<input type='text' id='custom' name='Custom' required data-msg-containerid='customError' />
165165
<span className='e-float-line'></span>
166166
<label className='e-float-text' htmlFor='custom'>Custom Function (maximum 5 characters)</label>
167167
</div>

0 commit comments

Comments
 (0)