hooking up the contact form, need to fininsh ajax request

This commit is contained in:
Madeleine Shang 2017-02-05 22:46:13 +00:00
parent 9df146815b
commit 67c8d7923e
2 changed files with 47 additions and 6 deletions

View file

@ -1,3 +1,5 @@
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<div class="hero" id="hero">
<div class="hero__background">
@ -17,20 +19,20 @@
{% t pages.contact.form-pretext-2 %}
</div>
<div class="col-sm-6">
<form>
<form onsubmit="return false;">
<div class="row">
<div class="col-xs-12">
<input placeholder="Name" type="text" class="input-block">
<input id="contact_name" placeholder="Name" type="text" class="input-block">
</div>
</div>
<div class="row">
<div class="col-xs-12">
<input class="input-block" placeholder="Email" type="text">
<input id = 'contact_email' class="input-block" placeholder="Email" type="text">
</div>
</div>
<div class="row">
<div class="col-xs-12">
<select class="form-control input-block" placeholder="category">
<select id="contact_category" class="form-control input-block" placeholder="category">
<option value="">Category</option>
<option value="feedback">Feedback</option>
</select>
@ -38,12 +40,12 @@
</div>
<div class="row">
<div class="col-xs-12">
<textarea placeholder="Message" class="input-block"></textarea>
<textarea id="contact_message" placeholder="Message" class="input-block"></textarea>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<input class="btn-blue-solid" type="submit" value="Send Message">
<input class="btn-blue-solid reset" type="submit" value="Send Message">
</div>
</div>
</form>
@ -56,3 +58,5 @@
<!-- Hero stripe -->
<div class="hero__stripe"></div>
</div>

37
src/js/contact.js Executable file
View file

@ -0,0 +1,37 @@
;(function ($) {
'use strict';
$(document).ready(function () {
$('.reset').on('click',function () {
var name = $('#contact_name').val();
var email = $('#contact_email').val();
var category = $('#contact_category').val();
var message = $('#contact_message').val();
// $.ajax({
// type: 'POST',
// url: 'https://mandrillapp.com/api/1.0/messages/send.json',
// data: {
// 'key': 'YOUR API KEY HERE',
// 'message': {
// 'from_email': 'YOUR@EMAIL.HERE',
// 'to': [
// {
// 'email': 'RECIPIENT@EMAIL.HERE',
// 'name': 'RECIPIENT NAME (OPTIONAL)',
// 'type': 'to'
// }
// ],
// 'autotext': 'true',
// 'subject': 'YOUR SUBJECT HERE!',
// 'html': 'YOUR EMAIL CONTENT HERE! YOU CAN USE HTML!'
// }
// }
// }).done(function(response) {
// console.log(response); // if you're into that sorta thing
// });
console.log(name,email,category,message);
$(this).closest('form').find('input[type=text], textarea').val('');
});
});
}(jQuery));