Skip to content

Commit b29a4f2

Browse files
oltonolton
committed
Added method �alidate() to �alidator component
1 parent fc9df78 commit b29a4f2

5 files changed

Lines changed: 130 additions & 3 deletions

File tree

‎CHANGELOG.md‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,5 @@
22

33
+ [x] Added attribute `data-size` to `analog-clock` component
44
+ [x] Refactored `clock` component, added attributes `data-size`, `data-hour-format=12|24`, improved time calculation
5-
+ [x] Fixed `data-on-color`, `data-off-color` for `rating` component
5+
+ [x] Fixed `data-on-color`, `data-off-color` for `rating` component
6+
+ [x] Added method `validate()` to `validator` component

‎examples/validator-{submit}.html‎

Lines changed: 119 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,119 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
6+
<link href="../lib/metro.css" rel="stylesheet">
7+
<link href="../lib/icons.css" rel="stylesheet">
8+
9+
<title>Validator - Form Submit - Metro UI :: Popular HTML, CSS and JS library</title>
10+
11+
</head>
12+
<body class="cloak h-100-vh">
13+
<nav data-role="appbar" class="border-bottom bd-default" data-expand="true">
14+
<div class="app-bar-item-static no-hover">
15+
<div class="text-leader" id="component-name">Validator - Form Submit</div>
16+
</div>
17+
<div class="app-bar-item-static no-hover ml-auto">
18+
<input type="checkbox" data-role="theme-switcher"/>
19+
</div>
20+
</nav>
21+
22+
<div class="container h-100 d-flex flex-center">
23+
<FORM data-role="validator" action="" method="post" class="w-75">
24+
25+
<DIV class="mt-10">
26+
27+
<DIV class="row">
28+
<DIV class="cell-2">
29+
<input id="MACHINE" name="machine" data-role="input"
30+
data-label="Machine" data-validate="required"
31+
data-cls-label="text-bold fg-black" value="mrdorunrun" />
32+
</DIV>
33+
<DIV class="cell-2">
34+
<input id="SIZE" name="size" data-role="input"
35+
data-label="Size kb" data-validate="number required min=1 max=100000"
36+
data-cls-label="text-bold fg-black" value="" />
37+
</DIV>
38+
</DIV>
39+
40+
<DIV class="row">
41+
<DIV class="cell-4">
42+
<select id="CATEGORIES" name="categories" data-role="select" data-validate="required" data-filter="true" data-show-group-name="true" data-cls-option-group="text-bold bg-white fg-terracotta" data-label="Category" data-cls-label="text-bold fg-black" size="1">
43+
<OPTION value="|">&nbsp;</OPTION>
44+
<OPTGROUP label="Arcade">
45+
<OPTION class="pl-7" value="QXJjYWRl|Kg==">*</OPTION>
46+
<OPTION class="pl-7" value="QXJjYWRl|Rm9ydHVuZSBUZWxsZXI=">Fortune Teller</OPTION>
47+
<OPTION class="pl-7" value="QXJjYWRl|UGh5c2ljYWwgQWJpbGl0eQ==">Physical Ability</OPTION>
48+
<OPTION class="pl-7" value="QXJjYWRl|UGluYmFsbA==">Pinball</OPTION>
49+
<OPTION class="pl-7" value="QXJjYWRl|U2tpbGwgRHJvcA==">Skill Drop</OPTION>
50+
<OPTION class="pl-7" value="QXJjYWRl|U3RyZW5ndGggVGVzdGVy">Strength Tester</OPTION>
51+
<OPTION class="pl-7" value="QXJjYWRl|VW5rbm93bg==">Unknown</OPTION>
52+
</OPTGROUP>
53+
<OPTGROUP label="Ball & Paddle">
54+
<OPTION class="pl-7" value="QmFsbCAmIFBhZGRsZQ==|Kg==">*</OPTION>
55+
<OPTION class="pl-7" value="QmFsbCAmIFBhZGRsZQ==|QnJlYWtvdXQ=">Breakout</OPTION>
56+
<OPTION class="pl-7" value="QmFsbCAmIFBhZGRsZQ==|SnVtcCBhbmQgVG91Y2g=">Jump and Touch</OPTION>
57+
<OPTION class="pl-7" value="QmFsbCAmIFBhZGRsZQ==|TWlzYy4=">Misc.</OPTION>
58+
<OPTION class="pl-7" value="QmFsbCAmIFBhZGRsZQ==|UG9uZw==">Pong</OPTION>
59+
</OPTGROUP>
60+
<OPTGROUP label="Bartop">
61+
<OPTION class="pl-7" value="QmFydG9w|Kg==">*</OPTION>
62+
<OPTION class="pl-7" value="QmFydG9w|TXVsdGktR2FtZXM=">Multi-Games</OPTION>
63+
</OPTGROUP>
64+
<OPTGROUP label="Board Game">
65+
<OPTION class="pl-7" value="Qm9hcmQgR2FtZQ==|Kg==">*</OPTION>
66+
<OPTION class="pl-7" value="Qm9hcmQgR2FtZQ==|QmFja2dhbW1vbiBNYWNoaW5l">Backgammon Machine</OPTION>
67+
<OPTION class="pl-7" value="Qm9hcmQgR2FtZQ==|QnJpZGdlIE1hY2hpbmU=">Bridge Machine</OPTION>
68+
<OPTION class="pl-7" value="Qm9hcmQgR2FtZQ==|Q2FyZHM=">Cards</OPTION>
69+
<OPTION class="pl-7" value="Qm9hcmQgR2FtZQ==|Q2hlY2tlciBNYWNoaW5l">Checker Machine</OPTION>
70+
<OPTION class="pl-7" value="Qm9hcmQgR2FtZQ==|Q2hlc3MgQ29uc29sZQ==">Chess Console</OPTION>
71+
<OPTION class="pl-7" value="Qm9hcmQgR2FtZQ==|Q2hlc3MgTWFjaGluZQ==">Chess Machine</OPTION>
72+
<OPTION class="pl-7" value="Qm9hcmQgR2FtZQ==|Q2hpbmVzZSdzIENoZXNzIE1hY2hpbmU=">Chinese's Chess Machine</OPTION>
73+
<OPTION class="pl-7" value="Qm9hcmQgR2FtZQ==|RGFtZSBNYWNoaW5l">Dame Machine</OPTION>
74+
<OPTION class="pl-7" value="Qm9hcmQgR2FtZQ==|TXVsdGktR2FtZXMgTWFjaGluZQ==">Multi-Games Machine</OPTION>
75+
</OPTGROUP>
76+
</select>
77+
</DIV>
78+
</DIV>
79+
80+
<DIV class="row no-gap border-top bd-blue border-size-2 mt-2 py-2">
81+
<DIV class="cell-2 pl-7">
82+
<BUTTON id="SUBMIT" type="button" onClick="onBeforeSubmit(this.form);"
83+
class="button medium bg-sat-cyan bg-cyan-hover fg-white"><SPAN class="icon mif-checkmark" ></SPAN>Conferma</BUTTON>
84+
<button>Submit</button>
85+
</DIV>
86+
</DIV>
87+
</DIV>
88+
</FORM>
89+
</div>
90+
91+
<script src="../lib/metro.js"></script>
92+
<script>
93+
function onBeforeSubmit(pForm) {
94+
95+
Metro.dialog.create({
96+
title: "INSERT",
97+
content: "Confermi l'inserimento nel DB?",
98+
defaultActions: false,
99+
customButtons: [{
100+
text: "Si",
101+
cls: "js-dialog-close alert medium",
102+
onclick: function() {
103+
if ($(pForm).data('validator').validate()) {
104+
pForm.submit();
105+
}
106+
}},
107+
{
108+
text: "No",
109+
cls: "js-dialog-close medium",
110+
onclick: function() {
111+
return false;
112+
}
113+
}]
114+
});
115+
116+
}
117+
</script>
118+
</body>
119+
</html>

‎lib/metro.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -45269,6 +45269,9 @@ ${err.message}`);
4526945269
}
4527045270
return result.val === 0;
4527145271
},
45272+
validate: function() {
45273+
return this._submit();
45274+
},
4527245275
changeAttribute: () => {
4527345276
}
4527445277
});

‎lib/metro.js.map‎

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎source/components/validator/validator.js‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -357,6 +357,10 @@
357357
return result.val === 0;
358358
},
359359

360+
validate: function () {
361+
return this._submit();
362+
},
363+
360364
changeAttribute: () => {},
361365
});
362366
})(Metro, Dom);

0 commit comments

Comments
 (0)