﻿/*
**  Name：数据绑定控件
**  Author：Maikou
**  DateTime：2011-01-22
**  参数：
**          url：远程取数据路径
**          templet：模板选择器（此处的模板选择器为模板直系父结构）
**          pageSettings：取数据所需要的参数，如PageIndex、PageSize等等（该处的参数将在url所对应的程序里使用）
**          columns：数据绑定控件中每条记录中将要显示的列，
此处的列名称必须和json字符串中的对象属性一致，并且在模板中以两个美元符号$包括，如$Id$。
每个column对象中至少有一个属性 name，即为对应json中的对象属性名称；
callback为回调方法，处理当前列数据
**  示例：
var columns = [
{ name: "Email" },
{ name: "CreateDate" },
{ name: "LeaveWord" },
{ name: "CreateDate", callback: getDate },
{ name: "ReplyBy" },
{ name: "ReplyMsg" },
{ name: "ReplyDate", callback: getDate }
];
$("#div_Context").DataGrid("/Handler/LeaveWorldHandler.ashx",
"#div_templet",
{
"Type": "Feedback",
"Controll": "Select",
"PageIndex": page_index,
"PageSize": <%= PageSize %>
},
columns);
<div id="div_templet">
<div class="consult_box" style="width: 685px; overflow: hidden; border-bottom: 1px dashed #ccc">
<p class="ask_title">
$Email$ $CreateDate$</p>
<p class="ask_text">
$LeaveWord$
</p>
<div id="Div1" runat="server" class="MainContent">
<img src="<%= TemplateUtility.TemplateImage("consult_reply_top.gif") %>" class="block ml10"
alt="" />
<p class="answer">
<span class="red">$ReplyBy$:</span> $ReplyMsg$<span>$ReplyDate$</span>
</p>
</div>
</div>
</div>
*/
(function ($) {
    $.fn.DataGrid = function (url, templet, pageSettings, columns, attrcall) {
        var content = $(this);
        $(templet).hide();
        $.getJSON(url,
            pageSettings,
             function (data) {
                 if (data) {
                     content.children().remove();
                     $.each(data, function (i, item) {
                         var record = $(templet).clone().html().toString();
                         $.each(columns, function (i, column) {
                             var cell = item[column["name"]];
                             if (column.callback)
                                 cell = column.callback(cell);
                             record = record.replace("$" + column["name"] + "$", cell);
                         });
                         if (attrcall)
                             content.append(attrcall($(record)));
                         else
                             content.append($(record));
                     });
                 }
             });
    }
})(jQuery)
