Ajaxified fact example

This commit is contained in:
Michael Snoyman 2009-12-21 16:15:35 +02:00
parent 7ab3b406db
commit 921dbf9b6c
2 changed files with 23 additions and 2 deletions

View File

@ -2,11 +2,29 @@
<html>
<head>
<title>Factorials</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script>
$(function(){
$("#num").parent().append("<span id='result'></span>");
$("#submit").click(function() {
$.getJSON($("#num").attr("value") + "/", function(o) {
$("#result").text("fact(" + o.input + ") = " + o.result);
});
return false;
});
});
</script>
<style>
#result {
padding-left: 1em;
color: #090;
}
</style>
</head>
<body>
<form method="get" action="fact/">
<p><label for="num">Number:</label> <input type="text" id="num" name="num"></p>
<p><input type="submit" value="Get the factorial!"></p>
<p><input id="submit" type="submit" value="Get the factorial!"></p>
</form>
</body>
</html>

View File

@ -16,7 +16,10 @@ instance Yesod Fact where
|]
index = return $ StaticFile TypeHtml "examples/fact.html"
fact i = return $ toHtmlObject $ show $ product [1..fromIntegral i]
fact i = return $ toHtmlObject
[ ("input", show i)
, ("result", show $ product [1..fromIntegral i])
]
factRedirect = do
i <- getParam "num"
redirect $ "../" ++ i ++ "/"