代码:
<div class="Category">
<span >Edit Categories</span>
<table>
<tbody></tbody>
</table>
</div>
<div>
<!--Add New Category-->
<span >Add New Category</span>
<hr/>
<h3>
Title
</h3>
<input type="text" size="40" style="height: 30px; font-size: 18px">
<h3>
Description(30 characters including HTML)
</h3>
<textarea rows="10" cols="54" style="display: block; margin-bottom: 20px;"></textarea>
<input type="button" value="ADD">
</div>
<script type="text/javascript" src="/static/admin/js/jquery-1.10.2.js"></script>
<script type="text/javascript">
// 1. 先获取浏览器的宽度
// 2. 获取左边的宽度
// 3. 相减
window.onload=function (){
<!--var total_length = window.innerWidth;-->
<!--console.log(total_length);-->
<!--var left_length = document.getElementsByClassName("nav")[0].offsetHeight;-->
<!--var right_length = total_length - left_length;-->
var form = {};
<!--document.getElementsByClassName("right_side")[0].style.width = right_length + 'px';-->
// 写ajax 获取 category , 然后生成table
$.ajax({
url: "/showcategory",
type: 'post',
data: form,
success: function(arg){
var my_data = JSON.parse(arg);
if (my_data["statuscode"]==2000){
var category_info = my_data["value"];
// 1. 先生成表头
// 2. 在生成table body
<!--var title = [];-->
var title = ["ID", "Title", "TitleStatus", "CreateTime"];
var table = document.getElementsByTagName('table')[0];
if(category_info.length != 0){
<!--for (var i in category_info[0]){-->
<!--title.push(i);-->
<!--}-->
for (var c = 0; c < title.length; c++){
var th = document.createElement('th');
table.getElementsByTagName('tbody')[0].appendChild(th);
table.getElementsByTagName('tbody')[0].getElementsByTagName('th')[c].innerHTML = title[c];
}
for (var b = 0; b < category_info.length; b++){
var tr = document.createElement('tr');
for (var i in title){
var td = document.createElement("td");
if (title[i] == 'TitleStatus' && category_info[b][title[i]] == 1){
td.innerHTML = "True";
} else{
td.innerHTML = "" + category_info[b][title[i]];
}
tr.appendChild(td);
}
table.appendChild(tr);
}
}
}
}
})
}
// 1. 去model获取类型, 然后生成表格
</script>