<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>How to style Google Forms - Step 10</title>
<link type="text/css" rel="stylesheet" href="./F2/google-form-with-validation.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js" type="text/javascript"></script>
<script src="./F2/jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#commentForm").validate({meta: "validate"});
});
</script>
</head>
<body>
<script type="text/javascript">var submitted=false;</script>
<iframe name="hidden_iframe" id="hidden_iframe" style="display:none;"
onload="if(submitted){window.location='https://atzimes.appspot.com/';}"></iframe>
<form action="http://spreadsheets.google.com/formResponse?formkey=dDBiMzVraWsyZTJobzN3SnU5SjNmR2c6MQ&ifq"
method="post" target="hidden_iframe" id="commentForm" onsubmit="submitted=true;">
<h1>EXAMPLE 4:</h1>
<h1>Styled Google form with jQuery validation <em>and</em> email verification <em>and</em> confirmation redirect!</h1>
<div class="errorbox-good">
<div class="ss-form-entry"><label for="entry_1" minlength class="ss-q-title">How blue is the Sky?
</label>
<label for="entry_1" class="ss-q-help"></label>
<input type="text" name="entry.1.single" value="" class="required" title="Please tell me how how blue the sky is dammit!" id="entry_1"></div></div>
<br> <div class="errorbox-good">
<div class="ss-form-entry"><label for="entry_2" class="ss-q-title">How deep is the ocean?
</label>
<label for="entry_2" class="ss-q-help"></label>
<input type="text" name="entry.2.single" value="" class="required" title="You don't know how the deep the ocean is? Just guess." id="entry_2"></div></div>
<br> <div class="errorbox-good">
<div class="ss-form-entry"><label class="ss-q-title" for="entry_4">What's your email address?
</label>
<label class="ss-q-help" for="entry_4"></label>
<input type="text" name="entry.4.single" value="" id="required" class="{validate:{required:true, email:true, messages:{required:'Please enter your email address', email:'Please enter a valid email address'}}}"/></div></div>
<br>
<input type="hidden" name="pageNumber" value="0">
<input type="hidden" name="backupCache" value="">
<input type="submit" name="submit" value="Submit"></form>
<br /><br />
<a href="./F2/google-form-with-validation.css">Download the stylesheet!</a>
</body>
</html>
Комментариев нет:
Отправить комментарий