choplin/mongo-sample.html

## mongo-sample.html

<html>
	<head>
		<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
		<script type="text/javascript">
			$(function(){
				checkTweet();
				$('#input').submit(function(){
					var name = $('#name').val();
					var tweet = $('#tweet').val();
					var host = location.hostname;
					var url = "http://" + host + ":27080/test/tweet/_insert";
					var docs = [
						{
							"name": name
							,"tweet": tweet
						}
					];
					var data = 'docs=' + (JSON.stringify(docs));
					$.ajax({"url":url, "type":"POST", "data":data})
						.success(function(data){
							checkTweet();
						})
						.complete(function(){
							$('#tweet').val('');
						});
					return false;
				});
			});
			function checkTweet(){
				var host = location.hostname;
				var url = "http://" + host + ":27080/test/tweet/_find";
				$.ajax({
						"url":url
						,"dataType":"json"
						,"async":false
						,"crossDomain":true
						,"processData":false
					})
					.success(function(data){
						$('#list > tbody').html('');
						var res = data.results;
						for (var i=0,l=res.length; i<l; i++){
							var doc = res[i];
							var tr = '<tr><td>' + doc.name + '</td><td>' + doc.tweet + '</td></tr>';
							$('#list > tbody').prepend(tr);
						}

					})
					.complete(function(){
						console.log('complete');
					});
			}
		</script>
		<style type="text/css">
			.content {
				width: 600px;
				margin: 20px auto;
			}
			.input {
				margin: 0 auto;
			}
			.list {
				margin: 0 auto;
			}
		</style>
	</head>
	<body>
		<div class="content">
			<form id="input" class="input">
				<input type="TEXT" id="name" />
				<input type="TEXT" id="tweet" />
				<input type="SUBMIT" />
			</form>
			<table id="list" class="list">
				<thead>
					<tr>
						<td>なまえ</td>
						<td>ついーと</td>
					</tr>
				</thead>
				<tbody>
				</tbody>
			</table>
		</div>
	</body>
</html>

	<html>
	<head>
	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
	<script type="text/javascript">
	$(function(){
	checkTweet();
	$('#input').submit(function(){
	var name = $('#name').val();
	var tweet = $('#tweet').val();
	var host = location.hostname;
	var url = "http://" + host + ":27080/test/tweet/_insert";
	var docs = [
	{
	"name": name
	,"tweet": tweet
	}
	];
	var data = 'docs=' + (JSON.stringify(docs));
	$.ajax({"url":url, "type":"POST", "data":data})
	.success(function(data){
	checkTweet();
	})
	.complete(function(){
	$('#tweet').val('');
	});
	return false;
	});
	});
	function checkTweet(){
	var host = location.hostname;
	var url = "http://" + host + ":27080/test/tweet/_find";
	$.ajax({
	"url":url
	,"dataType":"json"
	,"async":false
	,"crossDomain":true
	,"processData":false
	})
	.success(function(data){
	$('#list > tbody').html('');
	var res = data.results;
	for (var i=0,l=res.length; i<l; i++){
	var doc = res[i];
	var tr = '<tr><td>' + doc.name + '</td><td>' + doc.tweet + '</td></tr>';
	$('#list > tbody').prepend(tr);
	}

	})
	.complete(function(){
	console.log('complete');
	});
	}
	</script>
	<style type="text/css">
	.content {
	width: 600px;
	margin: 20px auto;
	}
	.input {
	margin: 0 auto;
	}
	.list {
	margin: 0 auto;
	}
	</style>
	</head>
	<body>
	<div class="content">
	<form id="input" class="input">
	<input type="TEXT" id="name" />
	<input type="TEXT" id="tweet" />
	<input type="SUBMIT" />
	</form>
	<table id="list" class="list">
	<thead>
	<tr>
	<td>なまえ</td>
	<td>ついーと</td>
	</tr>
	</thead>
	<tbody>
	</tbody>
	</table>
	</div>
	</body>
	</html>