Commit c93602d9 by Kálmán Viktor

network: javascript validation on records

parent bac42a29
// regexes
mac_re = '^([0-9a-fA-F]{2}(:|$)){6}$';
alfanum_re = '^[A-Za-z0-9_-]+$';
domain_re = '^([A-Za-z0-9_-]\.?)+$';
ipv4_re = '^[0-9]+\.([0-9]+)\.([0-9]+)\.([0-9]+)$';
ipv6_re = '/^((?=.*::)(?!.*::.+::)(::)?([\dA-F]{1,4}:(:|\b)|){5}|([\dA-F]{1,4}:){6})((([\dA-F]{1,4}((?!\3)::|:\b|$))|(?!\2\3)){2}|(((2[0-4]|1\d|[1-9])?\d|25[0-5])\.?\b){4})$/i'
reverse_domain_re = '^(%\([abcd]\)d|[a-z0-9.-])+$';
$('#id_type').change(function() { $('#id_type').change(function() {
type = $(":selected", this).text(); type = $(":selected", this).text();
resetForm(); resetForm();
resetName(); resetName();
}); });
$('#id_host').change(function() { $('#id_host').change(function() {
var type = getType(); host_id = $("#id_host :selected").val();
host_id = $(":selected", this).val();
host_name = $(":selected", this).text();
// if user selected "----" reset the inputs // if user selected "----" reset the inputs
if(!host_id) { if(!host_id) {
resetForm(); resetForm();
} else {
setNameAndAddress();
} }
});
function setNameAndAddress() {
var type = $("#id_type :selected").text();
host_id = $("#id_host :selected").val();
host_name = $("#id_host :selected").text();
// if A or AAAA record // if A or AAAA record
else if(type[0] === "A") { if(type[0] === "A") {
promise = getHostData(host_id); promise = getHostData(host_id);
promise.success(function(data) { promise.success(function(data) {
hostname = document.getElementById("id_name"); hostname = document.getElementById("id_name");
...@@ -32,26 +47,130 @@ $('#id_host').change(function() { ...@@ -32,26 +47,130 @@ $('#id_host').change(function() {
} }
// if CNAME // if CNAME
else if(type === "CNAME") { else if(type === "CNAME") {
resetForm();
promise = getHostData(host_id); promise = getHostData(host_id);
promise.success(function(data) { promise.success(function(data) {
hostname = document.getElementById('id_name'); addr = document.getElementById('id_address');
hostname.disabled = true; addr.disabled = true;
hostname.value = data.hostname; addr.value = data.fqdn;
}); });
} }
// if MX // if MX
else if(type === "MX") { else if(type === "MX") {
resetForm(); if(!$('#id_address').val()) {
promise = getHostData(host_id); promise = getHostData(host_id);
promise.success(function(data) { promise.success(function(data) {
addr = document.getElementById('id_name'); addr = document.getElementById('id_address');
addr.value = "1D:" + data.fqdn; addr.value = "10:" + data.fqdn;
}); });
}
} }
}
$('#submit-id-submit').click(function() {
return validateForm();
}); });
function validateForm() {
type = $("#id_type :selected").text();
host = $('#id_host :selected').val();
messages = []
// if host is set
if(host && type[0] != "-") {
if(type === "CNAME") {
if(!$('#id_name').val()) {
messages.push({
'message': 'Name not set!',
'id': 'name'
});
}
}
// if host is not set
} else if(!host && type[0] != "-") {
if(!$('#id_address').val()) {
messages.push({
'message': 'No address set',
'id': 'address'
});
}
// address is set
else {
var addr = $('#id_address').val();
// ipv4
if(type === "A") {
if(!addr.match(ipv4_re)) {
messages.push({
'message': 'ipv4',
'id': 'address'
})
}
}
// ipv6
else if(type[0] === "A") {
if(!addr.match(ipv6_re)) {
messages.push({
'message': 'ivp6',
'id': 'address'
});
}
}
else if(type === "MX") {
mx = addr.split(':');
if(!(mx.length === 2 && mx[0].match("^[0-9]+$") && mx[1].match(domain_re))) {
messages.push({
'message': 'mx',
'id': 'address'
});
}
}
else if(['CNAME', 'NS', 'PTR', 'TXT'].indexOf(type) != -1) {
if(!addr.match(domain_re)) {
messages.push({
'message': 'address',
'id': 'address'
});
}
}
else {
messages.push({
'message': 'u wot m8'
});
}
}
} else {
messages.push({
'message': 'no type set',
'id': 'type'
});
}
// check other inputs
// domain
if(!$('#id_domain :selected').val()) {
messages.push({
'message': 'No domain set',
'id': 'domain'
});
}
// owner
if(!$('#id_owner :selected').val()) {
messages.push({
'message': 'No owner set',
'id': 'owner'
});
}
if(messages.length < 1) {
return true;
} else {
appendMessage('error', messages);
return false;
}
}
// //
function getHostData(pk) { function getHostData(pk) {
return $.ajax({ return $.ajax({
...@@ -60,11 +179,6 @@ function getHostData(pk) { ...@@ -60,11 +179,6 @@ function getHostData(pk) {
}); });
} }
// return the currently selected type's name
function getType() {
return $("#id_type :selected").text();
}
/* /*
* reset the form * reset the form
* *
...@@ -82,8 +196,15 @@ function resetForm() { ...@@ -82,8 +196,15 @@ function resetForm() {
hostname.value = ""; hostname.value = "";
addr.value = ""; addr.value = "";
} // reset invalid inputs too
$('div[id^="div_id_"][class*="error"]').each(function() {
$(this).removeClass('error');
});
// remove the error messages
$("#js_error").fadeOut();
}
// reset the hostname select // reset the hostname select
function resetName() { function resetName() {
...@@ -100,28 +221,61 @@ function resetName() { ...@@ -100,28 +221,61 @@ function resetName() {
* *
*/ */
$(function() { $(function() {
$('div[id^="div_id_"]').hide(); // type is set, so it's an existing record
$('#div_id_type .controls').append( if($('#id_type :selected').val()) {
' <a id="type_next" onclick="type_next()" class="btn btn-info">Next</a>' if($('#id_host :selected').val()) {
); setNameAndAddress();
$('#div_id_type').fadeIn(); }
}
// else we are creaing a new
else {
// hide all input containers
$('div[id^="div_id_"]').hide();
// hide the save button
$('#submit-id-submit').hide();
$('#div_id_type .controls').append(
' <a id="type_next" onclick="type_next()" class="btn btn-info">Next</a>'
);
$('#div_id_type').fadeIn();
}
}); });
// if user clicked the "Next" button, this function will be called // if user clicked the "Next" button, this function will be called
function type_next() { function type_next() {
$('#js_error').remove();
if($('#div_id_type :selected').val()) { if($('#div_id_type :selected').val()) {
$('#type_next').remove(); $('#type_next').remove();
$('div[id^="div_id_"]').fadeIn(); $('div[id^="div_id_"]').fadeIn();
$('#submit-id-submit').fadeIn();
} else { } else {
appendMessage('error', 'type pls'); message = [{
'message': 'type pls',
'id': 'type'
}];
appendMessage('error', message);
} }
return false; return false;
} }
function appendMessage(type, messages, id) {
$('#js_error').remove();
message = '<div id="js_error" style="display: none;" class="alert alert-' + type + ' alert-block"><ul>'
for(var i = 0;i < messages.length; i++) {
message += "<li>" +messages[i].message+ "</li>";
if(messages[i].id) {
$('#id_' + messages[i].id).closest('div[class="control-group"]').addClass("error");
}
}
function appendMessage(type, message) { message +='</ul></div>';
message = '<div id="js_error" style="display: none;" class="alert alert-' + type + '">' + message + '</div>';
$('.form-horizontal').before(message); $('.form-horizontal').before(message);
$('#js_error').fadeIn(); $('html, body').animate({ scrollTop: 0}, 'slow', function() {
$('#js_error').fadeIn();
});
} }
$('* [id^="id_"]').focus(function() {
id = "#div_" + $(this).prop('id');
if($(id).hasClass('error')) {
$(id).removeClass('error');
}
});
...@@ -12,3 +12,6 @@ ...@@ -12,3 +12,6 @@
{% crispy form %} {% crispy form %}
{% endblock %} {% endblock %}
{% block extra_etc %}
<script src="{% static "js/record-create.js" %}"></script>
{% endblock %}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment