Skip to content

Instantly share code, notes, and snippets.

@BriceShatzer

BriceShatzer/jsbin.awoyUZi.css

Created November 18, 2013 23:33
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save BriceShatzer/7537363 to your computer and use it in GitHub Desktop.
Save BriceShatzer/7537363 to your computer and use it in GitHub Desktop.
Download ZIP
NYE Party RSVP app
Raw
jsbin.awoyUZi.css
section{
width:600px;
padding: 15px;
margin: 15px auto ;
border:2px #00a1ff solid;
border-radius: 8px;
background-color: #00a1ff;
color:#fff;
}
h1 {color:#fff;text-align: center;}
label {min-width:600px;}
label, fieldset {margin-top: 25px;}
fieldset label {min-width:300px; margin-right: 0px;}
input {margin:25px;}
input[type="text"]{width:150px;}
input[type="checkbox"],
input[type="radio"] {margin-right: 10px;}
Raw
jsbin.awoyUZi.html
<html>
<head>
<title>New Year's Eve Party</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
</head>
<body>
<section>
<form>
<h1>RSVP for the NYE party</h3>
<label>Name: &nbsp;<input type="text" id="name" name="name" /></label>
<label>Email: &nbsp;<input type="text" id="email" name="email" /></label>
<fieldset id="attending">Will you be attending? <br>
<label><input type="radio" name="attending" id="attendingYes" value="yes"> yes</label>
<label><input type="radio" name="attending" id="attedningNo" value="no"> no</label>
</fieldset>
<fieldset id="bringing">What will you be brining <br>
<label> <input type="checkbox" name="bringing" id="bringing_pizza" value="pizza"> Pizza</label>
<label> <input type="checkbox" name="bringing" id="bringing_soda" value="soda"> Soda</label>
<label> <input type="checkbox" name="bringing" id="bringing_beer" value="beer"> Beer</label>
<label> <input type="checkbox" name="bringing" id="bringing_chips" value="chips"> Chips</label>
<label> <input type="checkbox" name="bringing" id="bringing_cookies" value="cookies"> Cookies</label>
</fieldset>
<input type="submit" value="submit" />
</form>
</section>
</body>
</html>
Raw
jsbin.awoyUZi.js
$('form').on('submit', (function(event) {
var formData = $(this).serialize();
$.post("http://tsljs.herokuapp.com/", formData , function () {
alert("thank you for RSVPing");
$('form input[type="text"').val('');
$('form input[type="checkbox"], form input[type="radio"]').prop('checked', false);
//$('')
})
//http://tsljs.herokuapp.com/
event.preventDefault()
}))
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment