starred/esx_core
1
0
Fork 0
mirror of https://github.com/esx-framework/esx_core.git synced 2026-09-03 03:38:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improved form handling with verifying data

Browse Source
This commit is contained in:
ElPumpo
2018-04-15 18:42:08 +02:00
parent 76e2637419
commit e5f69f3362
6 changed files with 150 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files
html/index.html
+4 -6
View File
@@ -1,8 +1,6 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="nui://game/ui/jquery.js" type="text/javascript"></script>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
@@ -14,9 +12,9 @@
<input id="firstname" type="text" placeholder="First name"><br>
<input id="lastname" type="text" placeholder="Last name"><br>
<input id="dateofbirth" type="text" placeholder="Date of Birth (YYYY-MM-DD)"><br>
<input id="height" type="text" placeholder="Height (48-96)"><br><center>
<input id="male" type="radio" name="sex" value="male">Male
<input id="female" type="radio" name="sex" value="female">Female<br></center>
<input id="height" type="text" placeholder="Height (140-200 cm)"><br><center>
<input type="radio" name="sex" value="m" checked>Male
<input type="radio" name="sex" value="f">Female<br></center>
<button id="submit" type="submit">Create</button>
</form>
</div>
html/script.js
+40 -34
View File
@@ -6,47 +6,53 @@ var cursorX = documentWidth / 2;
var cursorY = documentHeight / 2;
function UpdateCursorPos() {
cursor.style.left = cursorX;
cursor.style.top = cursorY;
cursor.style.left = cursorX;
cursor.style.top = cursorY;
}
function Click(x, y) {
var element = $(document.elementFromPoint(x, y));
element.focus().click();
var element = $(document.elementFromPoint(x, y));
element.focus().click();
}
$(function() {
window.addEventListener('message', function(event) {
if (event.data.type == "enableui") {
cursor.style.display = event.data.enable ? "block" : "none";
document.body.style.display = event.data.enable ? "block" : "none";
} else if (event.data.type == "click") {
// Avoid clicking the cursor itself, click 1px to the top/left;
Click(cursorX - 1, cursorY - 1);
}
});
window.addEventListener('message', function(event) {
if (event.data.type == "enableui") {
cursor.style.display = event.data.enable ? "block" : "none";
document.body.style.display = event.data.enable ? "block" : "none";
} else if (event.data.type == "click") {
// Avoid clicking the cursor itself, click 1px to the top/left;
Click(cursorX - 1, cursorY - 1);
}
});
$(document).mousemove(function(event) {
cursorX = event.pageX;
cursorY = event.pageY;
UpdateCursorPos();
});
$(document).mousemove(function(event) {
cursorX = event.pageX;
cursorY = event.pageY;
UpdateCursorPos();
});
document.onkeyup = function (data) {
if (data.which == 27) { // Escape key
$.post('http://esx_identity/escape', JSON.stringify({}));
}
};
document.onkeyup = function (data) {
if (data.which == 27) { // Escape key
$.post('http://esx_identity/escape', JSON.stringify({}));
}
};
$("#register").submit(function(e) {
e.preventDefault(); // Prevent form from submitting
$.post('http://esx_identity/register', JSON.stringify({
firstname: $("#firstname").val(),
lastname: $("#lastname").val(),
dateofbirth: $("#dateofbirth").val(),
sex: $("#sex").val(),
height: $("#height").val()
}));
});
$("#register").submit(function(e) {
e.preventDefault(); // Prevent form from submitting
// Verify date
var date = $("#dateofbirth").val();
var dateCheck = new Date($("#dateofbirth").val());
if (dateCheck == "Invalid Date") {
date == "invalid";
}
$.post('http://esx_identity/register', JSON.stringify({
firstname: $("#firstname").val(),
lastname: $("#lastname").val(),
dateofbirth: date,
sex: $("input[type='radio'][name='sex']:checked").val(),
height: $("#height").val()
}));
});
});
html/style.css
+10 -5
View File
@@ -4,6 +4,13 @@
display: none;
}
/* Required */
body {
font-family: sans-serif;
overflow: hidden;
display: none;
}
.dialog {
width: 300px;
position: absolute;
@@ -13,15 +20,13 @@
right: 0;
padding: 10px;
box-shadow: 0px 0px 50px 0px #000;
background-color: #f1f1f1;
overflow: hidden;
}
form {
margin: 0;
opacity: 0.9;
}
input[type=text] {
width: 93%;
width: 100%;
padding: 7px;
text-align: center;
}