moep/dynamicweb
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Added jquery validation for the order form

Browse source
This commit is contained in:
M.Ravi 2017-06-06 05:26:02 +05:30
parent 74c57a42db
commit d31b05a219
1 changed files with 49 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

67
datacenterlight/templates/datacenterlight/pricing.html
View file

@ -107,7 +107,7 @@
<div class="card"> <div class="card">
<img class="img-beta" src="{% static 'datacenterlight/img/beta-img.png' %}" alt=""> <img class="img-beta" src="{% static 'datacenterlight/img/beta-img.png' %}" alt="">
<div class="caption"> <div class="caption">
<form method="POST" action=""> <form id="order_form" method="POST" action="">
{% csrf_token %} {% csrf_token %}
<div class="title"> <div class="title">
@ -166,6 +166,9 @@
<input type="submit" class="btn btn-primary" value="{% trans 'Order Now!' %}"></input> <input type="submit" class="btn btn-primary" value="{% trans 'Order Now!' %}"></input>
</form> </form>
</div>
<div>
<div id="error_message_box" class="error-message-box"></div>
</div> </div>
</div> </div>
@ -216,23 +219,51 @@
<!-- jQuery --> <!-- jQuery -->
<script src="{% static 'datacenterlight/js/jquery.js' %}"></script> <script src="{% static 'datacenterlight/js/jquery.js' %}"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.5.4/bootstrap-select.js"></script>
<script type="text/javascript"> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.min.js"></script>
window.onload=function(){ <script type="text/javascript">
$('.selectpicker').selectpicker({ $(document).ready(function(){
style: 'btn-link', $.validator.setDefaults({
windowPadding: 10, ignore: []
}); });
var hash = window.location.hash.substr(1); $('#order_form').validate({
console.log(hash); wrapper: 'div',
if (hash == 'requestform'){ errorLabelContainer: "#error_message_box",
$('#reques-success-message').modal('show'); rules: {
} name: {
required: true,
}; minlength: 3
</script> },
email: {
required: true,
email: true
}
},
messages: {
name: "Please enter your name",
email: "Please enter a valid email address"
},
submitHandler: function (form) {
return true;
}
});
});
window.onload=function(){
$('.selectpicker').selectpicker({
style: 'btn-link',
windowPadding: 10,
});
var hash = window.location.hash.substr(1);
console.log(hash);
if (hash == 'requestform'){
$('#reques-success-message').modal('show');
}
};
</script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.5.4/bootstrap-select.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.5.4/bootstrap-select.js"></script>
<!-- Bootstrap Core JavaScript --> <!-- Bootstrap Core JavaScript -->