<<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>W2UI</title>
<link rel="stylesheet" type="text/css" href="./css/w2ui-1.4.3.css"/>
<script type="text/javascript" src="./js/jquery-2.1.0.min.js"></script>
<script type="text/javascript" src="./js/w2ui-1.4.3.js"></script>
</head>
<body>
<div id="grid" style="width:100%;height:450px;"></div>
<script type="text/javascript">
var group = [
{ id:1, text:"트와이스" }
, { id:2, text:"러블리즈" }
, { id:3, text:"여자친구" }
, { id:4, text:"마마무" }
, { id:5, text:"걸스데이" }
, { id:6, text:"AOA" }
, { id:7, text:"달샤벳" }
, { id:8, text:"에이핑크" }
, { id:9, text:"미스에이" }
];
jQuery(document).ready(function() {
jQuery("#grid").w2grid({
name : "grid"
, multiSearch:true
, columns : [
{ field:"check", caption:"check", size:"60px", editable:{ type:"checkbox" } }
, { field:"text", caption:"문자", size:"120px", editable:{ type:"text" } }
, { field:"int", caption:"숫자", size:"80px", render:"int", editable:{ type:"int", min:0, max:32756 } }
, { field:"money", caption:"돈", size:"80px", render:"money", editable:{ type:"money" } }
, { field:"percent", caption:"확률", size:"80px", render:"percent:1", editable:{ type:"percent", precision:1 } }
, { field:"color", caption:"색상", size:"80px", editable:{ type:"color" } }
, { field:"date", caption:"날짜", size:"90px", render:"date", style:"text-align:right", editable:{ type:"date" } }
, { field:"time", caption:"시간", size:"70px", editable:{ type:"time"} }
, { field:"list", caption:"리스트", size:"50%", editable:{ type:"list", items:group, showAll:true }
, render:function(record, index, col_index) {
var html = this.getCellValue(index, col_index);
return html.text || "";
}
}
, { field:"select", caption:"select", size:"100px", editable:{ type:"select", items:people }
, render:function(record, index, col_index) {
var html = "";
for(var g in :group) {
if(group[g].id == this.getCellValue(index, col_index)) {
html = group[g].text;
}
}
return html;
}
}
]
, records: [
{ recid:1, check:true, text:"사나팬", int:100, money:100, percent:55, date:"1996-12-29", time:"12:29 pm"
, list:{ id:1, text:"트와이스" }
}
, { recid:2, check:true, text:"혜리팬", int:180, money:170, percent:65, date:"1994-06-09", time:"06:09 am" }
, { recid:3, check:false, text:"나연팬", int:200, money:454.40, percent:15, date:"1995-09-22", time:"09:22 pm"
, list:{ id:1, text:"트와이스" }
}
, { recid:4, check:true, text:"모모팬", int:300, money:1040, percent:98, date:"1996-11-09", time:"11:09 am" }
, { recid:5, check:true, text:"Kei팬", int:350, money:140, percent:58, date:"1995-03-20", time:"03:20 pm"
, list:{ id:3, text:"러블리즈" }
}
, { recid:6, check:true, text:"초롱팬", int:930, money:930, percent:42, date:"1991-03-03", time:"03:03 pm" }
, { recid:7, check:true, text:"보미팬", int:280, money:450, percent:82, date:"1993-08-03", time:"08:03 am"
, list:{ id:8, text:"에이핑크" }
}
, { recid:8, check:true, text:"예린팬", int:120, money:270, percent:61, date:"1996-08-19", time:"08:19 pm" }
, { recid:9, check:true, text:"수지팬", int:900, money:980, percent:98, date:"1994-10-10", time:"10:10 pm" }
, { recid:10, check:false, text:"우희팬", int:600, money:3400, percent:100, date:"1991-11-21", time:"11:21 am"
, list:{ id:6, text:"AOA" }
}
, { recid:11, check:false, text:"민아팬", int:500, money:790, percent:39, date:"1993-05-13", time:"05:13 pm"
, list:{ id:5, text:"걸스데이" }
}
, { recid:12, check:false, text:"휘인팬", int:550, money:4040, percent:12, date:"1995-04-22", time:"04:22 pm"
, list:{ id:4, text:"마마무" }
}
, { recid:13, check:true, text:"모모팬", int:300, money:1040, percent:98, date:"1996-11-09", time:"11:09 am" }
, { recid:14, check:false, text:"민아팬", int:600, money:3400, percent:100, date:"1993-09-21", time:"09:21 am"
, list:{ id:6, text:"AOA" }
}
, { recid:15, check:false, text:"세리팬", int:400, money:500, percent:78, date:"1990-09-16", time:"09:16 am"
, list:{ id:7, text:"달샤벳" }
}
]
});
});
</script>
</body>
</html>
|
