RDForm
RDForm copied to clipboard
self contained example
It would be very helpful to have a self contained example to download as HTML file that includes everything needed. I am trying out RDForm using the running example but after downloading the source code I have to download all the dependencies like bootstrap as well, it would be easier if at least the dependencies like bootstrap.min.css were from a CDN instead.
That's how far I got it, only had to copy templates/form.html and js/hooks/hooks.js:
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<!-- JQueryUI Style -->
<link href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.min.css" rel="stylesheet">
<!-- Bootstrap -->
<link href="https://unpkg.com/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" media="screen">
<!-- style -->
<link href="https://unpkg.com/@donsi/[email protected]/css/rdform.css" rel="stylesheet" media="screen">
<style type="text/css">
body {
background: url("img/noise.png"), -o-linear-gradient(top, #F4F4F4 0px, #EEEEEE 100%) transparent;
background: url("img/noise.png") repeat scroll 0% 0%, -moz-linear-gradient(center top , #F4F4F4 0%, #EEEEEE 100%) repeat scroll 0% 0% transparent;
}
.container {
border: 1px solid lightGray;
padding: 2% 8%;
border-radius: 10px;
margin: 10px auto;
background: white;
max-width: 960px;
}
</style>
<title>RDForm</title>
</head>
<body>
<div class="container">
<h1>Welcome to RDForm!</h1>
<!-- the form container -->
<form action="#" class="form-horizontal rdform" role="form"></form>
</div>
<!-- jQuery -->
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<!-- JQuery UI -->
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jsonld/1.0.0/jsonld.min.js"></script>
<!-- own stuff -->
<script src="https://unpkg.com/@donsi/[email protected]/js/rdform.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.rdform').RDForm({
template: "templates/form.html",
hooks: "js/hooks/hooks.js",
debug: true,
verbose: true,
submit: function() {
console.log( JSON.stringify(this, null, '\t') );
}
});
});
</script>
</body>
</html>