nas/todo_api
2
1
Fork 0
Code Issues 1 Pull requests Releases Wiki Activity

Added zepto example

Browse source
This commit is contained in:
Maurits van der Schee 2016-04-10 01:46:26 +02:00
commit c67bbaf46b
1 changed files with 15 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

30
examples/client_zepto.html
View file

@ -2,6 +2,20 @@
<head> <head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/zepto/1.1.6/zepto.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/zepto/1.1.6/zepto.min.js"></script>
<script src="../lib/php_crud_api_transform.js"></script> <script src="../lib/php_crud_api_transform.js"></script>
<script id="PostListTemplate" type="text/html">
<ul>
<li>
<span class="id"></span>, <span class="content"></span>
<a href="javascript:void(0)" class="edit">edit</a>
<a href="javascript:void(0)" class="delete">del</a>
</li>
<li>
<form>
<input name="content"/>
</form>
</li>
</ul>
</script>
<script> <script>
function PostList(element,template) { function PostList(element,template) {
var self = this; var self = this;
@ -29,7 +43,7 @@ function PostList(element,template) {
}; };
self.render = function(data) { self.render = function(data) {
data = php_crud_api_transform(data); data = php_crud_api_transform(data);
$(element).html($(template).find('ul').html()); $(element).html($(template).html());
var item = $(element).find('li').first().remove(); var item = $(element).find('li').first().remove();
for (var i=0;i<data.posts.length; i++) { for (var i=0;i<data.posts.length; i++) {
var clone = item.clone(); var clone = item.clone();
@ -55,20 +69,6 @@ $(function(){ new PostList('#PostListDiv','#PostListTemplate'); });
</script> </script>
</head> </head>
<body> <body>
<div id="PostListTemplate" style="display:none;">
<ul>
<li>
<span class="id"></span>, <span class="content"></span>
<a href="javascript:void(0)" class="edit">edit</a>
<a href="javascript:void(0)" class="delete">del</a>
</li>
<li>
<form>
<input name="content"/>
</form>
</li>
</ul>
</div>
<div id="PostListDiv"> <div id="PostListDiv">
<span>Loading...</span> <span>Loading...</span>
</div> </div>